网页防止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 相关文章推荐
IE下使用cloneNode注意事项分享
Nov 22 Javascript
javascript判断office版本示例
Apr 11 Javascript
基于iframe实现类似于ajax的页面无刷新
May 31 Javascript
在JavaScript中判断整型的N种方法示例介绍
Jun 18 Javascript
JavaScript获取网页、浏览器、屏幕高度和宽度汇总
Dec 18 Javascript
Javascript中的Callback方法浅析
Mar 15 Javascript
JavaScript学习笔记之数组求和方法
Mar 23 Javascript
模板视图和AngularJS之间冲突的解决方法
Nov 22 Javascript
vue 使用Jade模板写html,stylus写css的方法
Feb 23 Javascript
IE浏览器下JS脚本提交表单后,不能自动提示问题解决方法
Jun 04 Javascript
vue-dplayer 视频播放器实例代码
Nov 08 Javascript
JS变量提升原理与用法实例浅析
May 22 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截取中文字符串的问题
2006/07/12 PHP
PHP 等比例缩放图片详解及实例代码
2016/09/18 PHP
PHP实现的自定义数组排序函数与排序类示例
2016/11/18 PHP
PHP-FPM运行状态的实时查看及监控详解
2016/11/18 PHP
thinkphp 验证码 的使用小结
2017/05/07 PHP
Yii2结合Workerman的websocket示例详解
2018/09/10 PHP
PHP使用函数用法详解
2018/09/30 PHP
菜鸟javascript基础整理1
2010/12/06 Javascript
jQuery.extend 函数详解
2012/02/03 Javascript
浅析Javascript中“==”与“===”的区别
2014/12/23 Javascript
JavaScript中数据结构与算法(一):栈
2015/06/19 Javascript
javascript动态添加删除tabs标签的方法
2015/07/06 Javascript
Nodejs进阶:express+session实现简易登录身份认证
2017/04/24 NodeJs
Angular中的interceptors拦截器
2017/06/25 Javascript
JavaScript中各数制转换全面总结
2017/08/21 Javascript
小程序实现带年月选取效果的日历
2018/06/27 Javascript
微信小程序开发背景图显示功能
2018/08/08 Javascript
Vue 第三方字体图标引入 Font Awesome的方法
2018/09/28 Javascript
Nodejs核心模块之net和http的使用详解
2019/04/02 NodeJs
Vue+Node实现商品列表的分页、排序、筛选,添加购物车功能详解
2019/12/07 Javascript
jQuery实现简单轮播图效果
2020/12/27 jQuery
[02:49]DAC2018决赛日TOP5 LGD开启黑暗之门绝杀VP
2018/04/08 DOTA
Python实现信用卡系统(支持购物、转账、存取钱)
2016/06/24 Python
pandas DataFrame数据转为list的方法
2018/04/11 Python
Python 数据库操作 SQLAlchemy的示例代码
2019/02/18 Python
django框架CSRF防护原理与用法分析
2019/07/22 Python
Python二元赋值实用技巧解析
2019/10/25 Python
python GUI库图形界面开发之PyQt5打开保存对话框QFileDialog详细使用方法与实例
2020/02/27 Python
Python filter过滤器原理及实例应用
2020/08/18 Python
python 下划线的不同用法
2020/10/24 Python
约瑟夫·特纳男装:Joseph Turner
2017/10/10 全球购物
试用期员工考核制度
2014/01/22 职场文书
运动会口号8字
2014/06/07 职场文书
小学安全汇报材料
2014/08/14 职场文书
优秀大学生申请书
2019/06/24 职场文书
SpringCloud Function SpEL注入漏洞分析及环境搭建
2022/04/08 Java/Android