使用jQuery检测大写锁定开启/关闭

如何使用jQuery打开/关闭Caps Lock键？ 我有一个密码textbox ，我只允许使用小写字母，所以我不希望Caps Lock键打开。

是否可以使用jQuery检测Caps Lock键的状态？

如何使用Javascript检测大写锁定。 

 function capLock(e){ var kc = e.keyCode ? e.keyCode : e.which; var sk = e.shiftKey ? e.shiftKey : kc === 16; var visibility = ((kc >= 65 && kc <= 90) && !sk) || ((kc >= 97 && kc <= 122) && sk) ? 'visible' : 'hidden'; document.getElementById('divMayus').style.visibility = visibility }

然后为您的密码表格：

有一个名为capslockstate的jQuery插件 ，它将监视整个页面上的大写锁定键的状态，而不仅仅是在特定的字段中。

您可以查询大写锁定键的状态，也可以定义事件侦听器以响应状态更改。

该插件比其他建议更好地进行检测和状态管理，包括使用非英语键盘，监视Caps Lock键本身的使用，以及如果键入非字母字符则不忘记状态。

有两个演示， 一个显示基本事件绑定 ，另一个仅在密码字段具有焦点时显示警告 。

例如 

 $(document).ready(function() { /* * Bind to capslockstate events and update display based on state */ $(window).bind("capsOn", function(event) { $("#statetext").html("on"); }); $(window).bind("capsOff", function(event) { $("#statetext").html("off"); }); $(window).bind("capsUnknown", function(event) { $("#statetext").html("unknown"); }); /* * Additional event notifying there has been a change, but not the state */ $(window).bind("capsChanged", function(event) { $("#changetext").html("changed").show().fadeOut(); }); /* * Initialize the capslockstate plugin. * Monitoring is happening at the window level. */ $(window).capslockstate(); // Call the "state" method to retreive the state at page load var initialState = $(window).capslockstate("state"); $("#statetext").html(initialState); });

和 

 $(document).ready(function() { /* * Bind to capslockstate events and update display based on state */ $(window).bind("capsOn", function(event) { if ($("#Passwd:focus").length > 0) { $("#capsWarning").show(); } }); $(window).bind("capsOff capsUnknown", function(event) { $("#capsWarning").hide(); }); $("#Passwd").bind("focusout", function(event) { $("#capsWarning").hide(); }); $("#Passwd").bind("focusin", function(event) { if ($(window).capslockstate("state") === true) { $("#capsWarning").show(); } }); /* * Initialize the capslockstate plugin. * Monitoring is happening at the window level. */ $(window).capslockstate(); });

插件的代码可以在GitHub上查看。

但是你忘记了什么。 如果您按下大写锁定并切换并输入，则不会显示“大写已开启”消息。

这是一个更正版本：

我找到了一个更好的方法来使用jquery：这样你可以检测到用户何时按下capslock，用户不需要键入一个字母来检查:(用户需要输入至少1个键才能开始检测大写）演示： http ： //arthurfragoso.onphp.net/codes/capslock.html 

 Checking Caps Lock using Jquery - Javascript   
 
 User: 
 
  
 
 Password:

我做的是什么时候发出警告

  1. 用户名或密码不正确
  2. 提供的用户名或密码都是大写的。

仅允许较小的字母是一个非常糟糕的主意。 通过这样做，您可以大量减少可能的密码数量。

在用户创建密码后，当他们在登录期间输入密码时，您可以在检查密码是否正确之前将其转换为服务器上的小写。

以这种方式为用户节省工作量。

Interesting Posts