jquery利用event.which方法获取键盘输入值的代码


Posted in Javascript onOctober 09, 2011

实例
显示按了哪个键:
$("input").keydown(function(event){
$("div").html("Key: " + event.which);
});
亲自试一试
定义和用法
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://demo.3water.com/jslib/jquery/jquery-1.6.1.js"></script> 
<script type="text/css"> 
$(document).click(function(e){ 
alert(e.which); 
}) 
</script> 
</head> 
<body> 
</body> 
</html>
Javascript 相关文章推荐
javascript函数库-集合框架
Apr 27 Javascript
jquery中实现简单的tabs插件功能的代码
Mar 02 Javascript
Jquery 动态循环输出表格具体方法
Nov 23 Javascript
jquery实现翻动fadeIn显示的方法
Mar 05 Javascript
页面get请求 中文参数方法乱码问题的快速解决方法
May 31 Javascript
BootStrap网页中代码显示用法详解
Oct 21 Javascript
Omi v1.0.2发布正式支持传递javascript表达式
Mar 21 Javascript
react-router4 嵌套路由的使用方法
Jul 24 Javascript
前端图片懒加载(lazyload)的实现方法(提高用户体验)
Aug 21 Javascript
实例讲解javascript实现异步图片上传方法
Dec 05 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
Sep 28 Javascript
vue导航栏部分的动态渲染实例
Nov 01 Javascript
javascript之bind使用介绍
Oct 09 #Javascript
javascript之querySelector和querySelectorAll使用说明
Oct 09 #Javascript
使用jQuery操作Cookies的实现代码
Oct 09 #Javascript
jQuery实现切换页面布局使用介绍
Oct 09 #Javascript
passwordStrength 基于jquery的密码强度检测代码使用介绍
Oct 08 #Javascript
关于jQuery的inArray 方法介绍
Oct 08 #Javascript
imgAreaSelect 中文文档帮助说明
Oct 08 #Javascript
You might like
php at(@)符号的用法简介
2009/07/11 PHP
php实现网站插件机制的方法
2009/11/10 PHP
YII2.0框架行为(Behavior)深入详解
2019/07/26 PHP
javascript自执行函数之伪命名空间封装法
2010/12/25 Javascript
再分享70+免费的jquery 图片滑块效果插件和教程
2014/12/15 Javascript
js滑动提示效果代码分享
2016/03/10 Javascript
JavaScript实现点击文本自动定位到下拉框选中操作
2016/06/15 Javascript
JS 日期与时间戮相互转化的简单实例
2016/06/22 Javascript
jQuery获取file控件中图片的宽高与大小
2016/08/04 Javascript
NodeJs安装npm包一直失败的解决方法
2017/04/28 NodeJs
浅谈nodejs中的类定义和继承的套路
2017/07/26 NodeJs
JavaScript中防止微信浏览器被整体拖动的方法
2017/08/25 Javascript
微信小程序引入VANT组件的方法步骤
2019/09/19 Javascript
jquery 遍历hash操作示例【基于ajax交互】
2019/10/12 jQuery
windows系统中python使用rar命令压缩多个文件夹示例
2014/05/06 Python
Python使用plotly绘制数据图表的方法
2017/07/18 Python
python 按照固定长度分割字符串的方法小结
2018/04/30 Python
使用TensorFlow实现SVM
2018/09/06 Python
将python2.7添加进64位系统的注册表方式
2019/11/20 Python
Django框架获取form表单数据方式总结
2020/04/22 Python
宝塔面板出现“open_basedir restriction in effect. ”的解决方法
2021/03/14 PHP
详解HTML5 Canvas标签及基本使用
2020/01/10 HTML / CSS
将世界上最美丽的摄影作品转化为艺术作品:Photos.com
2017/11/28 全球购物
俄罗斯园林植物网上商店:Garshinka
2020/07/16 全球购物
妇产科护士自我鉴定
2013/10/15 职场文书
高中生的学习总结自我鉴定
2013/10/26 职场文书
经济管理专业毕业生自荐信范文
2014/01/02 职场文书
房地产还款计划书
2014/01/10 职场文书
留学推荐信怎么写
2014/01/25 职场文书
餐厅考勤管理制度
2014/01/28 职场文书
护士自我鉴定总结
2014/03/24 职场文书
2014年社区个人工作总结
2014/12/02 职场文书
导游词之太湖
2019/10/08 职场文书
解决MultipartFile.transferTo(dest) 报FileNotFoundExcep的问题
2021/07/01 Java/Android
大脑的记忆过程在做数据压缩,不同图形也有共同的记忆格式
2022/04/29 数码科技
win10如何开启ahci模式?win10开启ahci模式详细操作教程
2022/07/23 数码科技