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知识点收藏
Feb 22 Javascript
js 自动播放的实例代码
Nov 19 Javascript
jQuery中的一些常见方法小结(推荐)
Jun 13 Javascript
Node.js中用D3.js的方法示例
Jan 16 Javascript
canvas实现粒子时钟效果
Feb 06 Javascript
Node.js pipe实现源码解析
Aug 12 Javascript
微信小程序选择图片和放大预览图片功能
Nov 02 Javascript
JavaScript中this关键字用法实例分析
Aug 24 Javascript
ckeditor一键排版功能实现方法分析
Feb 06 Javascript
国内常用的js类库大全(CDN公共库)
Jun 24 Javascript
实例讲解React 组件生命周期
Jul 08 Javascript
vue element table中自定义一些input的验证操作
Jul 18 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开发负载均衡指南
2010/07/17 PHP
Codeigniter实现发送带附件的邮件
2015/03/19 PHP
php app支付宝回调(异步通知)详解
2018/07/25 PHP
自己实现string的substring方法 人民币小写转大写,数字反转,正则优化
2012/09/02 Javascript
一个页面放2段图片滚动代码出现冲突的问题如何解决
2012/12/21 Javascript
js使用DOM操作实现简单留言板的方法
2015/04/10 Javascript
详解JavaScript中数组的相关知识
2015/07/29 Javascript
使用jquery+CSS3实现仿windows10开始菜单的下拉导航菜单特效
2015/09/24 Javascript
分享五个有用的jquery小技巧
2015/10/08 Javascript
AngularJS 2.0新特性有哪些
2016/02/18 Javascript
深入理解React中es6创建组件this的方法
2016/08/29 Javascript
bootstrap下拉菜单使用方法解析
2017/01/13 Javascript
vue生成随机验证码的示例代码
2017/09/29 Javascript
Angular通过指令动态添加组件问题
2018/07/09 Javascript
React手稿之 React-Saga的详解
2018/11/12 Javascript
vue自定义组件(通过Vue.use()来使用)即install的用法说明
2020/08/11 Javascript
python使用urllib2提交http post请求的方法
2015/05/26 Python
Python比较2个时间大小的实现方法
2018/04/10 Python
python3库numpy数组属性的查看方法
2018/04/17 Python
PyTorch CNN实战之MNIST手写数字识别示例
2018/05/29 Python
使用python+whoosh实现全文检索
2019/12/09 Python
详解python 中in 的 用法
2019/12/12 Python
使用python实现希尔、计数、基数基础排序的代码
2019/12/25 Python
python3中sys.argv的实例用法
2020/04/24 Python
python thrift 实现 单端口多服务的过程
2020/06/08 Python
如何从csv文件构建Tensorflow的数据集
2020/09/21 Python
详解css3中dispaly的Grid布局与Flex布局
2020/09/11 HTML / CSS
西班牙英格列斯百货法国官网:El Corte Inglés法国
2017/07/09 全球购物
世界排名第一的运动鞋市场:Flight Club
2020/01/03 全球购物
如何为DataGridView添加一个定制的Column Type
2014/01/21 面试题
事业单位竞聘上岗实施方案
2014/03/28 职场文书
新文化运动的口号
2014/06/21 职场文书
党员对照检查材料思想汇报(党的群众路线)
2014/09/24 职场文书
法学专业求职信范文
2015/03/19 职场文书
钢琴师观后感
2015/06/12 职场文书
Linux安装Nginx步骤详解
2021/03/31 Servers