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 相关文章推荐
一个很简单的办法实现TD的加亮效果.
Jun 29 Javascript
jquery 操作日期、星期、元素的追加的实现代码
Feb 07 Javascript
jquery实现每个数字上都带进度条的幻灯片
Feb 20 Javascript
js点击button按钮跳转到另一个新页面
Oct 10 Javascript
Bootstrap基础学习
Jun 16 Javascript
Bootstrap和Java分页实例第一篇
Dec 23 Javascript
详解在 Angular 项目中添加 clean-blog 模板
Jul 04 Javascript
JS实现获取汉字首字母拼音、全拼音及混拼音的方法
Nov 14 Javascript
vue-router beforeEach跳转路由验证用户登录状态
Dec 26 Javascript
bootstrap-table实现表头固定以及列固定的方法示例
Mar 07 Javascript
关于在LayUI中使用AJAX提交巨坑记录
Oct 25 Javascript
解决vue项目 build之后资源文件找不到的问题
Sep 12 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字符串截取中文截取2,单字节截取模式
2007/12/10 PHP
php.ini save_handler 修改不生效的解决办法
2014/07/22 PHP
Web程序工作原理详解
2014/12/25 PHP
php简单实现屏蔽指定ip段用户的访问
2015/04/29 PHP
WordPress中注册菜单与调用菜单的方法详解
2015/12/18 PHP
php实现简单的权限管理的示例代码
2017/08/25 PHP
ThinkPHP整合datatables实现服务端分页的示例代码
2018/02/10 PHP
jQuery checkbox全选/取消全选实现代码
2009/11/14 Javascript
JS 控制非法字符的输入代码
2009/12/04 Javascript
javascript中的关于类型转换的性能优化
2010/12/14 Javascript
基于JQUERY的多级联动代码
2012/01/24 Javascript
解析URI与URL之间的区别与联系
2013/11/22 Javascript
JS获得选取checkbox整行数据的方法
2015/01/28 Javascript
javascript原生ajax写法分享
2016/04/10 Javascript
js实现简单的二级联动效果
2017/03/09 Javascript
JavaScript在控件上添加倒计时功能的实现代码
2017/07/04 Javascript
Angular实现的table表格排序功能完整示例
2017/12/22 Javascript
vue.js自定义组件实现v-model双向数据绑定的示例代码
2020/01/08 Javascript
vue页面更新patch的实现示例
2020/03/25 Javascript
vue中destroyed方法的使用说明
2020/07/21 Javascript
[03:52]DOTA2英雄基础教程 酒仙
2013/12/23 DOTA
[52:31]VP vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
横向对比分析Python解析XML的四种方式
2016/03/30 Python
Python的爬虫框架scrapy用21行代码写一个爬虫
2017/04/24 Python
浅谈Python编程中3个常用的数据结构和算法
2019/04/30 Python
Python学习笔记之集合的概念和简单使用示例
2019/08/22 Python
python3 BeautifulSoup模块使用字典的方法抓取a标签内的数据示例
2019/11/28 Python
python网络编程:socketserver的基本使用方法实例分析
2020/04/09 Python
一篇文章带你搞定Ubuntu中打开Pycharm总是卡顿崩溃
2020/11/02 Python
芝加哥牛排公司:Chicago Steak Company
2018/10/31 全球购物
音乐系毕业生自荐信
2013/10/27 职场文书
编辑找工作求职信范文
2013/12/16 职场文书
运动会四百米广播稿
2014/01/19 职场文书
商业企业管理专业求职信
2014/07/10 职场文书
一篇文章弄清楚Ajax请求的五个步骤
2022/03/17 Javascript
微前端qiankun改造日渐庞大的项目教程
2022/06/21 Javascript