2016-10-19 74 views
2

我想檢測是否大寫鎖定在輸入元素中使用焦點事件時處於活動狀態,但沒有任何按鍵,例如具有IE輸入密碼類型的行爲。 對於IE瀏覽器時,你是焦點,這種投入密碼出現警告提示如果用戶具有積極大寫鎖定即使用戶沒有按任何鍵是什麼,我想用JS做。 現在我的代碼只是按鍵事件工作如何檢測CAPS LOCK STATUS是否處於活動狀態而無需按下任何使用JS的鍵?

$(function() {//check caps lock on 
       var isIE = !isIE && !!window.StyleMedia; 
       if (isIE == true) { 
        document.msCapsLockWarningOff = true; 
       }    
        $('#Password').keypress(function (key) { 
         if (key.charCode >= 65 && key.charCode <= 90) 
          $('#capLockOn').tooltip('show'); 
         else { 
          $('#capLockOn').tooltip('hide'); 
         } 
         //Hide the tooltip when moving away from the password field 
         $('#Password').blur(function (e) { 
          $('#capLockOn').tooltip('hide'); 
         }); 
        }); 

      }); 

我想補充的警告沒有瀏覽器的任何本地預警保持一致的設計 任何建議,請...

+0

可能重複[你如何判斷大寫鎖定是否使用JavaScript?](http://stackoverflow.com/questions/348792/how-do-you-tell-if-caps-lock-is-on -using-javascript) – aug

+0

另請參閱http://stackoverflow.com/a/10680954/215042 – RobIII

+0

感謝您的回覆,但所有示例都是針對按鍵的,我知道我應該在焦點事件上使用,但是我需要知道是如何檢測大寫鎖定狀態的。並且我想添加警告而沒有任何瀏覽器本機警告以保持一致的設計 – UserEsp

回答

1

您可以使用KeyboardEvent.getModifierState('CapsLock');。這將返回修改鍵的當前狀態(MDN Docs)。

$('#inputBox').addEventListener('focus', function(e) { 
    e.getModifierState('CapsLock'); 
}); 

當用戶關注任何你想要的東西時,這會給你大寫鎖定修飾符的當前狀態。

+1

好主意,只要[您不需要支持Safari一段時間](http://caniuse.com/#search = getModifierState) –

+0

沒錯,雖然它看起來像是用於IE。我相信這是Safari的原生行爲 – Xenith

+0

感謝您的答案我做錯了什麼我得到「Uncaught TypeError:$(...)。addEventListener不是一個函數」因爲我得到一個數組,所以我嘗試$('#Password')[0] .addEventListener('focus',function(e)但我得到了「e.getModifierState不是函數」,然後我嘗試了e.originalEvent.getModifierState('CapsLock');但是我仍然得到錯誤任何線索請 – UserEsp

相關問題