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 相关文章推荐
jquery UI 1.72 之datepicker
Dec 29 Javascript
通过url查找a元素应用案例
Apr 29 Javascript
浅谈Javascript如何实现匀速运动
Dec 19 Javascript
jQuery中unwrap()方法用法实例
Jan 16 Javascript
JS基于面向对象实现的拖拽库实例
Sep 24 Javascript
GitHub上一些实用的JavaScript的文件压缩解压缩库推荐
Mar 13 Javascript
Angularjs实现下拉框联动的示例代码
Aug 22 Javascript
jQuery滚动条美化插件nicescroll简单用法示例
Apr 18 jQuery
Vue 莹石摄像头直播视频实例代码
Aug 31 Javascript
JavaScript实现连连看连线算法
Jan 05 Javascript
Vue框架TypeScript装饰器使用指南小结
Feb 18 Javascript
在vue中获取wangeditor的html和text的操作
Oct 23 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
打造计数器DIY三步曲(上)
2006/10/09 PHP
php编译安装php-amq扩展简明教程
2016/06/25 PHP
ThinkPHP和UCenter接口冲突的解决方法
2016/07/25 PHP
PHP+JavaScript实现无刷新上传图片
2017/02/21 PHP
jQuery 性能优化手册 推荐
2010/02/23 Javascript
用JS控制回车事件的代码
2011/02/20 Javascript
jquery ui对话框实例代码
2013/05/10 Javascript
Eclipse去除js(JavaScript)验证错误
2014/02/11 Javascript
chrome下jq width()方法取值为0的解决方法
2014/05/26 Javascript
js实现文章文字大小字号功能完整实例
2014/11/01 Javascript
javascript之with的使用(阿里云、淘宝使用代码分析)
2016/10/11 Javascript
几种tab切换详解
2017/02/03 Javascript
jQuery插件HighCharts绘制2D带Label的折线图效果示例【附demo源码下载】
2017/03/08 Javascript
原生js实现简单的Ripple按钮实例代码
2017/03/24 Javascript
vue.js-div滚动条隐藏但有滚动效果的实现方法
2018/03/03 Javascript
10分钟上手vue-cli 3.0 入门介绍
2018/04/04 Javascript
实例讲解JS中pop使用方法
2019/01/27 Javascript
JavaScript观察者模式原理与用法实例详解
2020/03/10 Javascript
[01:02:53]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第二局
2016/03/06 DOTA
[05:31]干嘛呢兄弟!DOTA2 TI9语音轮盘部分出处
2019/05/14 DOTA
python: line=f.readlines()消除line中\n的方法
2018/03/19 Python
numpy实现合并多维矩阵、list的扩展方法
2018/05/08 Python
Python如何将装饰器定义为类
2020/07/30 Python
python+flask编写一个简单的登录接口
2020/11/13 Python
html5-canvas中使用clip抠出一个区域的示例代码
2018/05/25 HTML / CSS
html5小技巧之通过document.head获取head元素
2014/06/04 HTML / CSS
美国知名的旅游网站:OneTravel
2018/10/09 全球购物
优秀公益广告词大全
2014/03/19 职场文书
超市促销活动总结
2014/07/01 职场文书
团队会宣传标语
2014/10/09 职场文书
四风查摆问题及整改措施
2014/10/10 职场文书
2014年医药代表工作总结
2014/11/22 职场文书
城南旧事电影观后感
2015/06/16 职场文书
初中数学教学随笔
2015/08/15 职场文书
家访教师心得体会
2016/01/23 职场文书
python删除csv文件的行列
2021/04/06 Python