//获取键盘按键事件，可以使用keyup。

//问题:获取到键盘的按下Caps lock键时，不能知道当前状态是大写、还是小写状态。

//解决:

设置一个全局判断大小写状态的 标志：isCapital = -1;  //是否大写 -1:无状态、0:小写、1:大写

　　给window加一个监听键盘事件方便判断大小写状态，

　　给所有的输入都加上键盘监听事件，监听大小写切换。

如何判断键盘大小写?

　　首先我们不可能直接从用户按下Caps lock键而去判断用户切换大小写状态，只能从用户输入的每个字去判断。

另外注意 通过组合键按下的大小写.

a-z的keyCode 65-90

拿到keyCode不能判断其是大小写，只能再从光标的位置拿到它的值，然后用charCodeAt去转。

最后判断其是否在是大写。

 

提示我是用layer弹窗插件。

示例:

 1 //监听大小写。。。。
 2     //必须全局监听
 3     var isCapital = -1; //是否大写 -1:无状态、0:小写、1:大写
 4     jQuery(window).keyup(changeCapsLock);//监听全局
 5     //监听某个input
 6     jQuery(‘input[name=loginp]‘, loginForm).on(‘keyup‘, function(e){
 7         var lastVal = ‘‘;
 8         if (e.keyCode >= 65 && e.keyCode <= 90) {
 9             console.log(e);
10             lastVal = jQuery(this).val().substr(getCursortPosition.call(this,this)-1, 1).charCodeAt(0);
11             if ( lastVal == e.keyCode) {
12                 e.shiftKey ? ‘‘ : isCapital = 1;
13                 tipsCapsLock.call(this);
14             }else{
15                 e.shiftKey ? ‘‘ : isCapital = 0;
16                 layer.closeAll(‘tips‘);
17             }
18         }else{
19             changeCapsLock.call(this, e);
20         }
21     });
22     //是否切换大小写
23     function changeCapsLock(e){
24         e.stopPropagation();
25         if (e.keyCode !== 20) {return;}
26         switch(isCapital){
27             case -1:
28                 break;
29             case 0:
30                 isCapital = 1;
31                 tipsCapsLock.call(this,this);
32                 if (this !== window) tipsCapsLock.call(this);
33                 break;
34             case 1:
35                 if (this !== window) layer.closeAll(‘tips‘);
36                 isCapital = 0;
37                 break;
38         }
39     }
40 
41     //提示大小写
42     function tipsCapsLock(){
43         layer.tips(‘大写锁定已打开，可能会使您输入错误的密码。‘, this);
44     }
45     //得到当前输入光标的位置
46     function getCursortPosition (ctrl) {
47         var CaretPos = 0;   // IE Support
48         if (document.selection) {
49             ctrl.focus ();
50             var Sel = document.selection.createRange ();
51             Sel.moveStart (‘character‘, -ctrl.value.length);
52             CaretPos = Sel.text.length;
53         }
54         // Firefox support
55         else if (ctrl.selectionStart || ctrl.selectionStart == ‘0‘)
56             CaretPos = ctrl.selectionStart;
57         return (CaretPos);
58     }

 

 

转载自：http://www.bubuko.com/infodetail-1233863.html