js实例
代码如下 | 复制代码 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>用户按下键盘,显示keyCode</title> <style> body{ text-align:center; font:30px/1.5 5fae8f6f96c59ed1, arial; } pre{color:green;padding:10px 15px;background:#f0f0f0;border:1px dotted #333;font:12px/1.5 Courier New;text-align:left;} span{color:#999;} </style> <script type="text/javascript"> window.onload = function () { var oP = document.getElementsByTagName("p")[0]; document.onkeydown = function (event) { var event = event || window.event; oP.innerHTML = event.keyCode; return false } } </script> </head> <body> <p>这里将显示您按下键的 keyCode</p> </body> </html> |
当然我们也可以使用jquery event.which 获取用户按下键盘值
语法
event.which参数 描述
event 必需。规定要检查的事件。这个 event 参数来自事件绑定函数。
jQuery丢弃了标准的 button 属性采用 which,这有点让人费解。
which 是Firefox引入的,IE不支持。which的本意是获取键盘的键值(keyCode)。
jQuery中的which即可以是键盘的键值,也可以是鼠标的键值。
即当判断用户按下键盘的哪个键时可以使用which,当判断用户按下鼠标的哪个键时也可以用which。它一举两用了
代码如下 | 复制代码 |
// Add which for key events if ( event.which == null && (event.charCode != null || event.keyCode != null) ) { event.which = event.charCode != null ? event.charCode : event.keyCode; } // Add which for click: 1 === left; 2 === middle; 3 === right // Note: button is not normalized, so don't use it if ( !event.which && event.button !== undefined ) { event.which = (event.button & 1 ? 1 : ( event.button & 2 ? 3 : ( event.button & 4 ? 2 : 0 ) )); } |
标准的button采用0,1,2表示鼠标的左,中,右键。jQuery的which则使用用1,2,3。
还有一点让人不爽的是jQuery文档 event.which 中并没有提到which可以表示鼠标按键值,只提到了表示键盘按键值。源码中的注释也让人误解。
// Add which for click: 1 === left; 2 === middle; 3 === right
注意这里说的是click ,很容易让人使用click 事件,但实际上click事件中获取是错误的。下面就用 click 事件试试:
代码如下 | 复制代码 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title></title> <script src="http://code.jquery.com/jquery-1.6.1.js"></script> <script type="text/网页特效"> $(document).click(function(e){ alert(e.which); }) </script> </head> <body> </body> </html> |
时间: 2024-12-23 02:50:36