js设置组合快捷键/tabindex功能的方法


Posted in Javascript onNovember 21, 2013

快捷键在日常的使用还是挺多的,例如熟悉的粘贴ctrl+v,复制 ctrl+c,使用快捷键能提高我们的做事效率,特别是当我们熟悉了一种操作后,再次使用它来进行操作就会变得很方便,很顺手,对于使用键盘的重度用户,键盘永远比鼠标来的快。

1)tabindex:

就是利用tab来轻松的控制页面中的链接和表单元素
它的用法很简单:obj.tabindex  = tabindex; 这个tabindex 的值,按照w3c 的规定可以从0开始 一直到32767

2) js 设置组合快捷键

本质就是获得你要设置的这个键的keyCode 的值,如果要加ctrl,alt,shift,那么就添加一个ctrlkey,altKey,shiftKey来判断下,所以关键在于keycode的值

(1) 设置 ctrl +enter 提交
if (e.ctrlKey && e.keyCode == 13){
return submit();
}

(2) 设置  Alt+ 方向键 ←
if (e.altKey&& e.keyCode == 37){
return submit();
}

(3) 设置  shift+F10
if (e.shiftKey&& e.keyCode == 37){
return submit();
}

4) 设置en
ter 提交
if (e.keyCode == 13){
return submit();
}

这里附加一些常见的快捷键:
keycode    8 = BackSpace BackSpace
keycode    9 = Tab Tab
keycode   12 = Clear
keycode   13 = Enter
keycode   16 = Shift_L
keycode   17 = Control_L
keycode   18 = Alt_L
keycode   19 = Pause
keycode   20 = Caps_Lock
keycode   27 = Escape Escape
keycode   32 = space space
keycode   33 = Prior
keycode   34 = Next
keycode   35 = End
keycode   36 = Home
keycode   37 = Left
keycode   38 = Up
keycode   39 = Right
keycode   40 = Down
keycode   41 = Select
keycode   42 = Print
keycode   43 = Execute
keycode   45 = Insert
keycode   46 = Delete
keycode   47 = Help
注意:浏览器的兼容性问题

Javascript 相关文章推荐
popdiv
Jul 14 Javascript
学习ExtJS Panel常用方法
Oct 07 Javascript
JavaScript自执行闭包的小例子
Jun 29 Javascript
JS动态添加Table的TR,TD实现方法
Jan 28 Javascript
简单谈谈JavaScript的同步与异步
Dec 31 Javascript
jQuery xml字符串的解析、读取及查找方法
Mar 01 Javascript
jQuery模拟完美实现经典FLASH导航动画效果【附demo源码下载】
Nov 09 Javascript
微信小程序 页面之间传参实例详解
Jan 13 Javascript
vuex2中使用mapGetters/mapActions报错的解决方法
Oct 20 Javascript
VUE+elementui组件在table-cell单元格中绘制微型echarts图
Apr 20 Javascript
详解Node.JS模块 process
Aug 31 Javascript
React实现动效弹窗组件
Jun 21 Javascript
jtable列中自定义button示例代码
Nov 21 #Javascript
动态标签 悬停效果 延迟加载示例代码
Nov 21 #Javascript
JS两种定义方式的区别、内部原理
Nov 21 #Javascript
jQuery操作input值的各种方法总结
Nov 21 #Javascript
jqgrid 表格数据导出实例
Nov 21 #Javascript
js 实现菜单左右滚动显示示例介绍
Nov 21 #Javascript
Extjs4实现两个GridPanel之间数据拖拽功能具体方法
Nov 21 #Javascript
You might like
php在数组中查找指定值的方法
2015/03/17 PHP
PHP IDE PHPStorm配置支持友好Laravel代码提示方法
2015/05/12 PHP
PHP设计模式之建造者模式定义与用法简单示例
2018/08/13 PHP
javascript二维数组转置实例
2015/01/22 Javascript
jquery图片滚动放大代码分享(2)
2015/08/28 Javascript
JS Array.slice 截取数组的实现方法
2016/01/02 Javascript
JS事件添加和移出的兼容写法示例
2016/06/20 Javascript
Bootstrap Navbar Component实现响应式导航
2016/10/08 Javascript
Ajax的概述与实现过程
2016/11/18 Javascript
javascript 通过键名获取键盘的keyCode方法
2017/12/31 Javascript
js实现轮播图的完整代码
2020/10/26 Javascript
webpack4 CSS Tree Shaking的使用
2018/09/03 Javascript
nodejs中方法和模块用法示例
2018/12/24 NodeJs
JQuery省市联动效果实现过程详解
2020/05/08 jQuery
vue插件--仿微信小程序showModel实现模态提示窗功能
2020/08/19 Javascript
javascript前端实现多视频上传
2020/12/13 Javascript
Python中使用copy模块实现列表(list)拷贝
2015/04/14 Python
python检查URL是否正常访问的小技巧
2017/02/25 Python
python多线程socket编程之多客户端接入
2017/09/12 Python
Python程序员面试题 你必须提前准备!
2018/01/16 Python
Python实现判断给定列表是否有重复元素的方法
2018/04/11 Python
解决python 找不到module的问题
2020/02/12 Python
Python实现队列的方法示例小结【数组,链表】
2020/02/22 Python
基于Python生成个性二维码过程详解
2020/03/05 Python
Windows下PyCharm配置Anaconda环境(超详细教程)
2020/07/31 Python
浅析Python的命名空间与作用域
2020/11/25 Python
CSS3中利用animation属性创建雪花飘落特效
2014/05/14 HTML / CSS
阿迪达斯比利时官方商城:adidas比利时
2016/10/10 全球购物
介绍下java.util.Arrays类
2012/10/16 面试题
财务主管自我鉴定
2014/01/17 职场文书
老师给学生的表扬信
2014/01/17 职场文书
转预备党员政审材料
2014/02/06 职场文书
幼儿园户外活动总结
2014/07/04 职场文书
报效祖国演讲稿
2014/09/15 职场文书
《全神贯注》教学反思
2016/02/22 职场文书
JS前端使用canvas实现扩展物体类和事件派发
2022/08/05 Javascript