网页防止tab键的使用快速解决方法


Posted in Javascript onNovember 07, 2013

在一些网页或者说在弹出层的使用下,一般情况在ie浏览器下 我们都不希望使用tab 或者说 

使用tab键后都会造成一定的问题,例如:

在弹出层后,tab键还可以在目页中操作,这回导致脚本错误。

那么我们如果避免这种情况呢?

通过键盘事件来控制

<script language="javascript" type="text/javascript" src="../javascript/jquery-1.2.6.min.js"></script>
    <script language="javascript" type="text/javascript">
        $(document).ready(function () {
            $(document).bind('keydown', function (event) {
                if (event.keyCode == 9) {
                    document.body.focus();
                }
            });
        });
    </script>

以上代码很熟悉 就是按tab键的时候 将焦点再次移到tabindex为0的上面

那么我们这时便需要在页面开始的时候 就设置初始化的页面焦点

例如下面用aspx写的例子:

  <box:Button ID="BtnClose" Text="关闭" runat="server" SystemIcon="Close" TabIndex="0" FocusOnPageLoad="true">
            </box:Button>

在一些特殊的情况下 我们需要在页面加载的时候设置一下焦点的位置,以便防止 tabindex的设置会出现无效 或受其他因素的影响.

这样才能做到万无一失!

Javascript 相关文章推荐
CLASS_CONFUSION JS混淆 全源码
Dec 12 Javascript
很多人都是用下面的js刷新站IP和PV
Sep 05 Javascript
利用js实现选项卡的特别效果的实例
Mar 03 Javascript
JS对select控件option选项的增删改查示例代码
Oct 21 Javascript
JavaScript1.6数组新特性介绍以及JQuery的几个工具方法
Dec 06 Javascript
javascript页面动态显示时间变化示例代码
Dec 18 Javascript
JavaScript返回网页中锚点数目的方法
Apr 03 Javascript
jQuery Select下拉框操作小结(推荐)
Jul 22 Javascript
微信小程序之仿微信漂流瓶实例
Dec 09 Javascript
移动端使用localResizeIMG4压缩图片
Apr 22 Javascript
详解Angular2学习笔记之Html属性绑定
Jan 03 Javascript
详解vue修改elementUI的分页组件视图没更新问题
Nov 13 Javascript
判断js中各种数据的类型方法之typeof与0bject.prototype.toString讲解
Nov 07 #Javascript
addEventListener()第三个参数useCapture (Boolean)详细解析
Nov 07 #Javascript
zTree插件之单选下拉菜单实例代码
Nov 07 #Javascript
jQuery把表单元素变为json对象
Nov 06 #Javascript
JQuery插件开发示例代码
Nov 06 #Javascript
javascript实现yield的方法
Nov 06 #Javascript
Javascript事件实例详解
Nov 06 #Javascript
You might like
PHP调用VC编写的COM组件实例
2014/03/29 PHP
PHP开发微信支付的代码分享
2014/05/25 PHP
Laravel 5框架学习之向视图传送数据
2015/04/08 PHP
Laravel 模型使用软删除-左连接查询-表起别名示例
2019/10/24 PHP
javascript 三种编解码方式
2010/02/01 Javascript
定时器(setTimeout/setInterval)调用带参函数失效解决方法
2013/03/26 Javascript
js如何判断用户是在PC端和还是移动端访问
2014/04/24 Javascript
jQuery常用操作方法及常用函数总结
2014/06/19 Javascript
jquery delay()介绍及使用指南
2014/09/02 Javascript
jquery实现简单的轮换出现效果实例
2015/07/23 Javascript
Javascript之Math对象详解
2016/06/07 Javascript
谈谈JavaScript中的几种借用方法
2016/08/09 Javascript
JavaScript实现通过select标签跳转网页的方法
2016/09/29 Javascript
vue组件间通信子与父详解(二)
2017/11/07 Javascript
如何获取TypeScript的声明文件.d.ts
2018/05/01 Javascript
vue.js图片转Base64上传图片并预览的实现方法
2018/08/02 Javascript
Koa日志中间件封装开发详解
2019/03/09 Javascript
微信小程序 checkbox使用实例解析
2019/09/09 Javascript
原生JS运动实现轮播图
2021/01/02 Javascript
[07:06]2018DOTA2国际邀请赛寻真——卫冕冠军Team Liquid
2018/08/10 DOTA
[05:53]敌法师的金色冠名ID"BurNIng",是传说,是荣耀
2020/07/11 DOTA
Python理解递归的方法总结
2019/01/28 Python
Django使用redis缓存服务器的实现代码示例
2019/04/28 Python
pytz格式化北京时间多出6分钟问题的解决方法
2019/06/21 Python
基于Python中的yield表达式介绍
2019/11/19 Python
TensorFlow dataset.shuffle、batch、repeat的使用详解
2020/01/21 Python
Python表达式的优先级详解
2020/02/18 Python
解决Python logging模块无法正常输出日志的问题
2020/02/21 Python
python手机号前7位归属地爬虫代码实例
2020/03/31 Python
基于K.image_data_format() == 'channels_first' 的理解
2020/06/29 Python
浅析移动设备HTML5页面布局
2015/12/01 HTML / CSS
车间调度岗位职责
2013/11/30 职场文书
鲜花方阵解说词
2014/02/13 职场文书
邓小平理论心得体会
2014/09/09 职场文书
2015年卫生监督工作总结
2015/05/21 职场文书
2015年小学教导处工作总结
2015/05/26 职场文书