夏日博客

A-A+

jquery下event.which获取键盘、鼠标键值示例

2016年01月11日 前端设计 暂无评论 阅读 5 views 次

which 属性指示按了哪个键或按钮了，所以有了这个函数其实我们可以非常的简单的监测到我们按键及键值了，具体来看个例子。

jquery中使用event.which获取键盘、鼠标键值。event.which 将 event.keyCode 和 event.charCode 标准化了。

获取键盘输入值

  1. <!DOCTYPE html>   
  2. <html>   
  3. <head>   
  4. <meta charset="utf-8" />    
  5. <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8/jquery.min.js"></script>   
  6. <script type="text/javascript">  
  7. $(function(){  
  8. $("#txt").keydown(function(event){  
  9.  $("#msg").html(event.which);  
  10. });  
  11. })   
  12. </script>   
  13. <body>   
  14. <div id="msg"></div>  
  15. <input id="txt" type="text" value=""/>   
  16. </body>   
  17. </html>  

上例中event为JQuery事件对象，是必需的。规定要检查的事件。这个 event 参数来自事件绑定函数。

jQuery事件属性which可以获取键盘的键值，which属性在跨浏览器是依然是可靠的。推荐用 event.which 来监视键盘输入，而不是keyCode属性。

通过keypress事件的which属性可以获得可靠地、区分大小写的字符编码。但对于非字母符号在跨浏览器时是不可靠的。

通过keyup和keydown事件的which属性，只能获取不区分大小写的键编码（所以a和A都返回65），但可以通过检查shiftKey属性来确定大小写。对于非字母符号（例如：左箭头的编码是37）能可靠地运行。

获取鼠标的键值

  1. <!DOCTYPE html>   
  2. <html>   
  3. <head>   
  4. <meta charset="utf-8" />   
  5. <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8/jquery.min.js"></script>   
  6. <script type="text/javascript">  
  7. $(function(){  
  8.         $(document).mousedown(function(event){  
  9.                 alert(event.which);  
  10.         });  
  11. })   
  12. </script>   
  13. <body>  
  14. </body>   
  15. </html>  

对于鼠标事件，事件属性which也可以获取鼠标的键值（1为左，2为中，3为右），which属性以一致的方式跨越多种浏览器。因此应该利用which而不是button属性。

标签：

给我留言