js中获取键盘按下键值event.keyCode、event.charCode和event.which的兼容性详解


Posted in Javascript onMarch 15, 2017

前言

在阅读本文前,相信大家应该都有所了解,在js获取键盘按下的键值有:event.keyCodeevent.charCodeevent.which

其中:

谷歌浏览器:event.keyCodeevent.charCodeevent.which都兼容。

火狐浏览器:event.keyCode部分键值有效,如上下左右键(37,38,39,40),enter键(13),PgUp(33),PgDn(34)等部分有效,对数字键,字母键无效。

event.which也是部分键值有效,如字母键,数字键,enter键,Backspace键等有效,对上下左右键,PgUp(33),PgDn(34)键无效。

event.charCode也是对部分键值有效,如字母键,数字键,,Backspace键等有效,对enter键,上下左右键,PgUp(33),PgDn(34)键无效。

ie浏览器:中,IE8及以下浏览器对event.charCode无效,event.keyCodeevent.which对大部分键值能获得,但是有少部分也不能获得

网络查看说event.which event.keyCode event.charCode 标准化了。但实际还是有区别的。

所以一般都这样写兼容:

e.keyCode<span class="hljs-params">||</span>e.which<span class="hljs-params">||</span>e.charCode;

jquery API地址:http://api.jquery.com/event.which/

如下例子介绍Query限制文本框只能输入数字和小数点的方法

$(function(){
 /*JQuery 限制文本框只能输入数字*/
 $(".NumText").keyup(function(){
  $(this).val($(this).val().replace(/[^0-9]/g,''));
 }).bind("paste",function(){ //CTR+V事件处理 
  $(this).val($(this).val().replace(/[^0-9]/g,''));
 }).css("ime-mode", "disabled"); //CSS设置输入法不可用 

 /*JQuery 限制文本框只能输入数字和小数点*/
 $(".NumDecText").keyup(function(){
  $(this).val($(this).val().replace(/[^0-9.]/g,''));
 }).bind("paste",function(){ //CTR+V事件处理 
  $(this).val($(this).val().replace(/[^0-9.]/g,''));
 }).css("ime-mode", "disabled"); //CSS设置输入法不可用 
 });

Keycode对照表如下:

js中获取键盘按下键值event.keyCode、event.charCode和event.which的兼容性详解

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
9个javascript语法高亮插件 推荐
Jul 18 Javascript
初识javascript 文档碎片
Jul 13 Javascript
JQuery获取各种宽度、高度(format函数)实例
Mar 04 Javascript
javascript实现div的显示和隐藏的小例子
Jun 25 Javascript
JS实现可改变列宽的table实例
Jul 02 Javascript
详解js闭包
Sep 02 Javascript
2014年50个程序员最适用的免费JQuery插件
Dec 15 Javascript
JS实现进入页面时渐变背景色的方法
Feb 25 Javascript
Angular中的Promise对象($q介绍)
Mar 03 Javascript
JavaScript调用传递变量参数的相关问题及解决办法
Nov 01 Javascript
AnjularJS中$scope和$rootScope的区别小结
Sep 18 Javascript
详解如何在vue-cli中使用vuex
Aug 07 Javascript
jQuery实现移动端Tab选项卡效果
Mar 15 #Javascript
利用vue.js插入dom节点的方法
Mar 15 #Javascript
js实现彩色条纹滚动条效果
Mar 15 #Javascript
jQuery插件HighCharts实现的2D面积图效果示例【附demo源码下载】
Mar 15 #Javascript
jQuery阻止移动端遮罩层后页面滚动
Mar 15 #Javascript
字太多用...代替的方法(两种)
Mar 15 #Javascript
jQuery插件HighCharts实现的2D条状图效果示例【附demo源码下载】
Mar 15 #Javascript
You might like
PHP编码转换函数 自动转换字符集支持数组转换
2012/12/16 PHP
php 获取页面中指定内容的实现类
2014/01/23 PHP
php调用淘宝开放API实现根据卖家昵称获取卖家店铺ID的方法
2015/07/29 PHP
PHP实现QQ、微信和支付宝三合一收款码实例代码
2018/02/19 PHP
js获取当月最后一天实例代码
2013/11/19 Javascript
css与javascript跨浏览器兼容性总结
2014/09/15 Javascript
js使用DOM设置单选按钮、复选框及下拉菜单的方法
2015/01/20 Javascript
简介JavaScript中的getUTCFullYear()方法的使用
2015/06/10 Javascript
JavaScript多图片上传案例
2015/09/28 Javascript
解析JavaScript面向对象概念中的Object类型与作用域
2016/05/10 Javascript
如何以Angular的姿势打开Font-Awesome详解
2018/04/22 Javascript
详解Angular6 热加载配置方案
2018/08/18 Javascript
node.js的Express服务器基本使用教程
2019/01/09 Javascript
vue实现的微信机器人聊天功能案例【附源码下载】
2019/02/18 Javascript
vue点击标签切换选中及互相排斥操作
2020/07/17 Javascript
基于JS实现操作成功之后自动跳转页面
2020/09/25 Javascript
[01:51]2014DOTA2国际邀请赛 这个赛场没有失败者VGTi5再见
2014/07/23 DOTA
python实现的各种排序算法代码
2013/03/04 Python
用Python的Tornado框架结合memcached页面改善博客性能
2015/04/24 Python
Python中的字符串操作和编码Unicode详解
2017/01/18 Python
Python使用正则表达式过滤或替换HTML标签的方法详解
2017/09/25 Python
python自动截取需要区域,进行图像识别的方法
2018/05/17 Python
Sanic框架请求与响应实例分析
2018/07/16 Python
python 通过SSHTunnelForwarder隧道连接redis的方法
2019/02/19 Python
通过shell+python实现企业微信预警
2019/03/07 Python
Python3网络爬虫开发实战之极验滑动验证码的识别
2019/08/02 Python
python2爬取百度贴吧指定关键字和图片代码实例
2019/08/14 Python
基于python爬取梨视频实现过程解析
2020/11/09 Python
Python 实现RSA加解密文本文件
2020/12/30 Python
Django后端按照日期查询的方法教程
2021/02/28 Python
如何安装ruby on rails
2014/02/09 面试题
法律专业实习鉴定
2013/12/22 职场文书
迟到检讨书800字
2014/01/13 职场文书
高中微机老师自我鉴定
2014/02/16 职场文书
民间借贷借条如何写
2015/05/26 职场文书
vscode中使用npm安装babel的方法
2021/08/02 Javascript