网页防止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 相关文章推荐
js脚本学习 比较实用的基础
Sep 07 Javascript
在jQuery1.5中使用deferred对象 着放大镜看Promise
Mar 12 Javascript
js报错 Object doesn't support this property or method的原因分析
Mar 31 Javascript
javascript禁制后退键(Backspace)实例代码
Nov 15 Javascript
JavaScript实现使用Canvas绘制图形的基本教程
Oct 27 Javascript
ES6 javascript中class静态方法、属性与实例属性用法示例
Oct 30 Javascript
vue如何安装使用Quill富文本编辑器
Sep 21 Javascript
vue mounted 调用两次的完美解决办法
Oct 29 Javascript
详解将微信小程序接口Promise化并使用async函数
Aug 05 Javascript
layer 关闭指定弹出层的例子
Sep 25 Javascript
基于Vue 撸一个指令实现拖拽功能
Oct 09 Javascript
使用Element的InfiniteScroll 无限滚动组件报错的解决
Jul 27 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中用header图片地址 简单隐藏图片源地址
2008/04/09 PHP
PHP利用func_get_args和func_num_args函数实现函数重载实例
2014/11/12 PHP
php ajax实现文件上传进度条
2016/03/29 PHP
php each 返回数组中当前的键值对并将数组指针向前移动一步实例
2016/11/22 PHP
基于jQuery的合并表格中相同文本的相邻单元格的代码
2011/04/06 Javascript
jQuery实现图片放大预览实现原理及代码
2013/09/12 Javascript
jquery放大镜效果超漂亮噢
2013/11/15 Javascript
JavaScript中return false的用法
2015/03/12 Javascript
js验证真实姓名与身份证号是否匹配
2015/10/13 Javascript
CascadeView级联组件实现思路详解(分离思想和单链表)
2016/04/12 Javascript
js中Number数字数值运算后值不对的解决方法
2017/02/28 Javascript
Vue-Router实现组件间跳转的三种方法
2017/11/07 Javascript
jquery根据name取得select选中的值实例(超简单)
2018/01/25 jQuery
Vue如何使用混合Mixins和插件开发详解
2020/02/05 Javascript
mpvue实现微信小程序快递单号查询代码
2020/04/03 Javascript
antd-DatePicker组件获取时间值,及相关设置方式
2020/10/27 Javascript
[01:02:10]DOTA2上海特级锦标赛B组小组赛#2 VG VS Fnatic第一局
2016/02/26 DOTA
Python深入学习之内存管理
2014/08/31 Python
python回调函数用法实例分析
2015/05/09 Python
Python实现繁体中文与简体中文相互转换的方法示例
2018/12/18 Python
浅谈python requests 的put, post 请求参数的问题
2019/01/02 Python
Pycharm设置utf-8自动显示方法
2019/01/17 Python
python3 深浅copy对比详解
2019/08/12 Python
关于pytorch多GPU训练实例与性能对比分析
2019/08/19 Python
Python 3.8正式发布重要新功能一览
2019/10/17 Python
520使用Python实现“我爱你”表白
2020/05/20 Python
精油和天然健康美容产品:Art Naturals
2018/01/27 全球购物
vue实现倒计时功能
2021/03/24 Vue.js
前台接待岗位职责
2015/02/03 职场文书
2015年小学一年级班主任工作总结
2015/05/21 职场文书
幼儿园心得体会范文
2016/01/21 职场文书
Nginx配置Https安全认证的实现
2021/05/26 Servers
yolov5返回坐标的方法实例
2022/03/17 Python
vue打包时去掉所有的console.log
2022/04/10 Vue.js
Mongodb 迁移数据块的流程介绍分析
2022/04/18 MongoDB
不想升级Win11?教你彻底锁定老版Windows系统的方法(附下载地址)
2022/09/23 数码科技