网页防止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 相关文章推荐
使用Microsoft Ajax Minifier减小JavaScript文件大小的方法
Apr 01 Javascript
prettify 代码高亮着色器google出品
Dec 28 Javascript
将文本输入框内容加入表中的js代码
Aug 18 Javascript
SeaJS入门教程系列之SeaJS介绍(一)
Mar 03 Javascript
jquery+html5时钟特效代码分享(可设置闹钟并且语音提醒)
Mar 30 Javascript
微信支付如何实现内置浏览器的H5页面支付
Sep 25 Javascript
利用Js+Css实现折纸动态导航效果实例源码
Jan 25 Javascript
JS中的多态实例详解
Oct 15 Javascript
Vue中v-for的数据分组实例
Mar 07 Javascript
微信提示 在浏览器打开 效果实现过程解析
Sep 10 Javascript
mpvue微信小程序开发之实现一个弹幕评论
Nov 24 Javascript
Vue实现开关按钮拖拽效果
Sep 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
上海无线电三厂简史修改版
2021/03/01 无线电
PHP概率计算函数汇总
2015/09/13 PHP
php中注册器模式类用法实例分析
2015/11/03 PHP
Thinkphp5 如何隐藏入口文件index.php(URL重写)
2019/10/16 PHP
JSQL  一个 web DB 的封装
2010/05/05 Javascript
javascript 仿QQ滑动菜单效果代码
2010/09/03 Javascript
Javascript技巧之不要用for in语句对数组进行遍历
2010/10/20 Javascript
jQuery EasyUI API 中文文档 DateTimeBox日期时间框
2011/10/16 Javascript
Jquery图片延迟加载插件jquery.lazyload.js的使用方法
2014/05/21 Javascript
jQuery大于号(&gt;)选择器的作用解释
2015/01/13 Javascript
JavaScript使用Math.Min返回两个数中较小数的方法
2015/04/06 Javascript
VUEJS实战之修复错误并且美化时间(2)
2016/06/13 Javascript
不使用script导入js文件的几种方法
2016/10/27 Javascript
详解PHP中pathinfo()函数导致的安全问题
2017/01/05 Javascript
js 判断登录界面的账号密码是否为空
2017/02/08 Javascript
js控制文本框禁止输入特殊字符详解
2017/04/07 Javascript
js前端实现图片懒加载(lazyload)的两种方式
2017/04/24 Javascript
Vue引用第三方datepicker插件无法监听datepicker输入框的值的解决
2018/01/27 Javascript
基于vue的验证码组件的示例代码
2019/01/22 Javascript
详解django模板与vue.js冲突问题
2019/07/07 Javascript
vue指令v-html使用过滤器filters功能实例
2019/10/25 Javascript
基于element-ui封装可搜索的懒加载tree组件的实现
2020/05/22 Javascript
使用Python进行新浪微博的mid和url互相转换实例(10进制和62进制互算)
2014/04/25 Python
python初学之用户登录的实现过程(实例讲解)
2017/12/23 Python
Python常见字典内建函数用法示例
2018/05/14 Python
Python 隐藏输入密码时屏幕回显的实例
2019/02/19 Python
Python的条件锁与事件共享详解
2019/09/12 Python
Python使用QQ邮箱发送邮件报错smtplib.SMTPAuthenticationError
2019/12/20 Python
浅谈python中频繁的print到底能浪费多长时间
2020/02/21 Python
Python3自动生成MySQL数据字典的markdown文本的实现
2020/05/07 Python
Oral-B荷兰:牙医最推荐的品牌
2020/02/25 全球购物
行政管理人员精品工作推荐信
2013/11/04 职场文书
条幅标语大全
2014/06/20 职场文书
mysql 索引合并的使用
2021/08/30 MySQL
SpringBoot+Vue+JWT的前后端分离登录认证详细步骤
2021/09/25 Java/Android
oracle重置序列从0开始递增1
2022/02/28 Oracle