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 相关文章推荐
js onpropertychange输入框 事件获取属性
Mar 26 Javascript
JavaScript 格式字符串的应用
Mar 29 Javascript
node.js中的fs.fchownSync方法使用说明
Dec 16 Javascript
javascript中Date对象的getDay方法使用指南
Dec 22 Javascript
JS获取数组最大值、最小值及长度的方法
Nov 24 Javascript
基于jquery实现全屏滚动效果
Nov 26 Javascript
jQuery实现html双向绑定功能示例
Oct 09 jQuery
基于react后端渲染模板引擎noox发布使用
Jan 11 Javascript
vue2.0 路由不显示router-view的解决方法
Mar 06 Javascript
基于vue实现一个神奇的动态按钮效果
May 15 Javascript
JS实现长图上下滚动效果
Mar 19 Javascript
Vue登录拦截 登录后继续跳转指定页面的操作
Aug 04 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
在PWS上安装PHP4.0正式版
2006/10/09 PHP
实用PHP会员权限控制实现原理分析
2011/05/29 PHP
PHP父类调用子类方法的代码例子
2014/04/09 PHP
ThinkPHP CURD方法之page方法详解
2014/06/18 PHP
PHP异步进程助手async-helper
2018/02/05 PHP
PHP实现数组转JSon和JSon转数组的方法示例
2018/06/14 PHP
php设计模式之策略模式应用案例详解
2019/06/17 PHP
javascript,jquery闭包概念分析
2010/06/19 Javascript
jQuery EasyUI API 中文文档 - Panel面板
2011/09/30 Javascript
javascript阻止scroll事件多次执行的思路及实现
2013/11/08 Javascript
jquery中获取元素里某一特定子元素的代码
2014/12/02 Javascript
js焦点文字滚动效果代码分享
2015/08/25 Javascript
Javascript removeChild()删除节点及删除子节点的方法
2015/12/27 Javascript
JS加载器如何动态加载外部js文件
2016/05/26 Javascript
js基于cookie方式记住返回页面用法示例
2016/05/27 Javascript
AngularJS实现按钮提示与点击变色效果
2016/09/07 Javascript
分类解析jQuery选择器
2016/11/23 Javascript
本地搭建微信小程序服务器的实现方法
2017/10/27 Javascript
React中的refs的使用教程
2018/02/13 Javascript
webpack的pitching loader详解
2019/09/23 Javascript
Vue记住滚动条和实现下拉加载的完美方法
2020/07/31 Javascript
Element el-button 按钮组件的使用详解
2021/02/01 Javascript
Python3 入门教程 简单但比较不错
2009/11/29 Python
Python中删除文件的程序代码
2011/03/13 Python
Tornado Web服务器多进程启动的2个方法
2014/08/04 Python
Python的Flask框架应用调用Redis队列数据的方法
2016/06/06 Python
python中利用xml.dom模块解析xml的方法教程
2017/05/24 Python
Django如何使用asyncio协程和ThreadPoolExecutor多线程
2020/10/12 Python
CSS3弹性伸缩布局之box布局
2016/07/12 HTML / CSS
土耳其国际性时尚购物网站:Modanisa
2018/01/19 全球购物
迪卡侬比利时官网:Decathlon比利时
2019/12/28 全球购物
华为C++笔试题
2014/08/05 面试题
高中毕业自我鉴定范文
2013/10/02 职场文书
计划生育工作总结2015
2015/04/03 职场文书
餐厅服务员管理制度
2015/08/05 职场文书
Nginx的基本概念和原理
2022/03/21 Servers