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 尚未实现错误解决办法
Nov 27 Javascript
JS获取网页属性包括宽、高等等
Apr 03 Javascript
JavaScript动态加载样式表的方法
Mar 21 Javascript
js 性能优化之算法和流程控制
Feb 15 Javascript
JavaScript变量类型以及变量作用域详解
Aug 14 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
Aug 30 Javascript
AngularJS实现动态切换样式的方法分析
Jun 26 Javascript
浅谈angularJs函数的使用方法(大小写转换,拷贝,扩充对象)
Oct 08 Javascript
JS双向链表实现与使用方法示例(增加一个previous属性实现)
Jan 31 Javascript
基于vue手写tree插件的那点事儿
Aug 20 Javascript
Vue.js 实现地址管理页面思路详解(地址添加、编辑、删除和设置默认地址)
Dec 11 Javascript
js判断密码强度的方法
Mar 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 strip_tags()去除HTML、XML以及PHP的标签介绍
2014/02/18 PHP
php使用PDO下exec()函数查询执行后受影响行数的方法
2017/03/28 PHP
thinkPHP5框架导出Excel文件简单操作示例
2018/08/03 PHP
快速保存网页中所有图片的方法
2006/06/23 Javascript
jquery利用event.which方法获取键盘输入值的代码
2011/10/09 Javascript
document.addEventListener使用介绍
2014/03/07 Javascript
JavaScript分秒倒计时器实现方法
2015/02/02 Javascript
JavaScript每天定时更换皮肤样式的方法
2015/07/01 Javascript
基于jQuery实现网页打印功能
2015/12/01 Javascript
ztree获取选中节点时不能进入可视区域出现BUG如何解决
2015/12/03 Javascript
js实现增加数字显示的环形进度条效果
2017/02/05 Javascript
jQuery.Form实现Ajax上传文件同时设置headers的方法
2017/06/26 jQuery
ElementUI中el-tree节点的操作的实现
2020/02/27 Javascript
python用户管理系统的实例讲解
2017/12/23 Python
十个Python练手的实战项目,学会这些Python就基本没问题了(推荐)
2019/04/26 Python
python3 BeautifulSoup模块使用字典的方法抓取a标签内的数据示例
2019/11/28 Python
numpy.ndarray 实现对特定行或列取值
2019/12/05 Python
PyCharm使用之配置SSH Interpreter的方法步骤
2019/12/26 Python
python+opencv3生成一个自定义纯色图教程
2020/02/19 Python
python 字典item与iteritems的区别详解
2020/04/25 Python
python利用Excel读取和存储测试数据完成接口自动化教程
2020/04/30 Python
python中return如何写
2020/06/18 Python
如何Tkinter模块编写Python图形界面
2020/10/14 Python
使用Filters滤镜弥补CSS3的跨浏览器问题以及兼容低版本IE
2013/01/23 HTML / CSS
Aerosoles爱柔仕官网:美国舒软女鞋品牌
2017/07/17 全球购物
小米俄罗斯授权商店:Xiaomi俄罗斯
2019/12/08 全球购物
学生学习总结的自我评价
2013/10/22 职场文书
应届本科生推荐信范文
2013/12/25 职场文书
工程建设实施方案
2014/03/14 职场文书
寄语是什么意思
2014/04/10 职场文书
大学生求职自荐信范文
2015/03/04 职场文书
简短的人生哲理(38句)
2019/08/13 职场文书
适合青年人白手起家的创业项目分享
2019/08/16 职场文书
为什么你写的height:100%不起作用
2021/05/10 HTML / CSS
Python下opencv库的安装过程及问题汇总
2021/06/11 Python
Python基本知识点总结
2022/04/07 Python