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 相关文章推荐
JS显示下拉列表框内全部元素的方法
Mar 31 Javascript
WordPress中鼠标悬停显示和隐藏评论及引用按钮的实现
Jan 12 Javascript
浅谈javascript中new操作符的原理
Jun 07 Javascript
js严格模式总结(分享)
Aug 22 Javascript
Node.JS中事件轮询(Event Loop)的解析
Feb 25 Javascript
Javascript 实现匿名递归的实例代码
May 25 Javascript
js解决软键盘遮挡输入框的问题分享
Dec 19 Javascript
JS基于设计模式中的单例模式(Singleton)实现封装对数据增删改查功能
Feb 06 Javascript
浅析vue 函数配置项watch及函数 $watch 源码分享
Nov 22 Javascript
js前端面试之同步与异步问题详解
Apr 03 Javascript
vue使用openlayers实现移动点动画
Sep 24 Javascript
吃通javascript正则表达式
Apr 21 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中yar框架实例用法讲解
2020/12/27 PHP
一个JavaScript函数把URL参数解析成Json对象
2014/09/24 Javascript
jQuery实现自定义事件的方法
2015/04/17 Javascript
基于jQuery实现点击弹出层实例代码
2016/01/01 Javascript
详解Wondows下Node.js使用MongoDB的环境配置
2016/03/01 Javascript
微信小程序本作用域下调用全局JS详解及实例
2017/02/22 Javascript
JS实现自动轮播图效果(自适应屏幕宽度+手机触屏滑动)
2017/06/19 Javascript
jQuery实现获取form表单内容及绑定数据到form表单操作分析
2018/07/03 jQuery
JavaScript基于对象方法实现数组去重及排序操作示例
2018/07/10 Javascript
vue-cli构建vue项目的步骤详解
2019/01/27 Javascript
如何进行微信公众号开发的本地调试的方法
2019/06/16 Javascript
Vue学习之axios的使用方法实例分析
2020/01/06 Javascript
vue.js使用v-model实现父子组件间的双向通信示例
2020/02/05 Javascript
小程序实现图片移动缩放效果
2020/05/26 Javascript
[03:21]【TI9纪实】Old Boys
2019/08/23 DOTA
Python中sort和sorted函数代码解析
2018/01/25 Python
Python实现爬取百度贴吧帖子所有楼层图片的爬虫示例
2018/04/26 Python
Python输出\u编码将其转换成中文的实例
2018/12/15 Python
Python PyPDF2模块安装使用解析
2020/01/19 Python
哪种Python框架适合你?简单介绍几种主流Python框架
2020/08/04 Python
python excel多行合并的方法
2020/12/09 Python
Canvas与图片压缩的示例代码
2017/11/28 HTML / CSS
美国畅销的跑步机品牌:ProForm
2017/02/06 全球购物
体育专业个人的求职信范文
2013/09/21 职场文书
医药专业推荐信
2013/11/15 职场文书
财务担保书范文
2014/04/02 职场文书
《青山处处埋忠骨》教学反思
2014/04/22 职场文书
视光学专业自荐信
2014/06/24 职场文书
咖啡店创业计划书
2014/08/15 职场文书
干部作风建设年活动剖析材料
2014/10/23 职场文书
大学学生会主席竞选稿怎么写?
2019/08/19 职场文书
Python time库的时间时钟处理
2021/05/02 Python
react 项目中引入图片的几种方式
2021/06/02 Javascript
JavaScript实现登录窗体
2021/06/22 Javascript
使用canvas仿Echarts实现金字塔图的实例代码
2021/11/11 HTML / CSS
腾讯云服务器部署前后分离项目之前端部署
2022/06/28 Servers