TabIndex作用:

  tabindex:全局属性。指示其元素是否可以聚焦(获得焦点),以及它是否/在何处参与顺序键盘导航(因通常使用tab键操作,顾因此得名)。

  当使用tab键在网页控件中进行导航时,将首先移动到具有最小tabindex属性值的控件上,最后在具有最大tabindex属性值的控件上结束。

TabIndex的用法:

  

 <a href="//www.baidu.com" tabindex="2">百度</a>
<a href="//www.sina.com" tabindex = "1">新浪</a>

HTML 4.0.1与HTML5之间的差异:

  在HTML5中,tabindex属性可用于任何的HTML元素(它会验证任何HTML元素。但不一定是有用)。

  在HTML 4.0.1中,tabindex属性可用于:<a>,<area>,<button>,<input>,<object>,<select>和<textarea>。

浏览器兼容性:

TabIndex的方法:

  tabindex接受一个整数作为值,根据值得不同,具有不同的结果:

    • tabindex=负值(通常是tabindex="-1"),表示元素是可聚焦的,但是不能通过键盘进行导航来访问到该元素。在使用tab键时,此元素被忽略。用JS做页面小组件内部键盘导航的时候非常有用,注意:如果使用-1值时,onfocus与onblur事件仍能启动。
    • tabindex="0"(默认),表示元素是可聚焦的,并且可以通过键盘导航来聚焦到该元素,它的相对顺序是当前处于的DOM结构来决定的,即使采用了浮动改变了页面中显示的顺序,依然是按照HTML文档中的顺序来定位。
    • tabindex=正值(32767是临界点,具体请参考注意事项),表示元素是可聚焦的,并且可以通过键盘导航来访问到该元素;它的相对顺序按照tabindex的数值递增而滞后获取焦点。如果多个元素拥有相同的tabindex,它们的相对顺序按照它们在当前DOM中的先后顺序决定。

  根据键盘序列导航的顺序,值为0、非法值、或者没有tabindex值的元素应该放置在tabindex值为正值的元素后面。

  如果我们在<div>上设置了tabindex属性,它的子元素内容不能使用箭头键来滚动,除非我们在内容上也设置tabindex。

  注意事项:tabindex的最大值不应超过32767。在IE中,tabindex范围从1~32767之间(包括32767),在Firefox、Chrome无限制,不过一旦超出32767时,顺序跟tabindex=0时一样。如果没有指定,它的默认值为-1;

HTML TabIndex属性的更多相关文章

  1. html中input标签的tabindex属性

    当浏览者浏览网站时可以通过按TAB键在网页的链接中依次移动,这是一个相当方便实用的功能.但如果网页中链接太多,恐怕按TAB键就没什么作用了,这时不妨通过改变TAB键移动的顺序来突出重点,在某些重要页面 ...

  2. div/span等获取焦点问题(tabindex属性的简单理解)

    1.先看问题 当我们要对一个div/span元素获取焦点的时候,直接对$("#div1").focus()是不能实现效果的,比如下图: 当点击输入框进行输入后,在点击区域弹出选择地 ...

  3. tabindex属性

    1. tabindex的用法: 可以设置tab键在控件中的移动顺序. 以下元素支持tabindex属性:<a> <input> <textarea> <are ...

  4. (转)TabIndex 属性

    html中的tabIndex属性可以设置键盘中的TAB键在控件中的移动顺序,即焦点的顺序.   把控件的tabIndex属性设成1到32767的一个值,就可以把这个控件加入到TAB键的序列中.   这 ...

  5. tabindex属性用法

    支持tabindex属性的元素:<a> <input> <textarea> <area> <select> <button> ...

  6. tabindex 属性

    tabindex 属性规定元素的 tab 键控制次序(当 tab 键用于导航时). 语法:<element tabindex="number">规定元素的 tab 键控 ...

  7. TabIndex 属性 Tabindex="-1" 与Tabindex="0"、任意数字 (收录)

    TabIndex 属性 Tabindex="-1" 与Tabindex="0".任意数字 html中的tabIndex属性可以设置键盘中的TAB键在控件中的移动 ...

  8. bootstrap模态框嵌套、tabindex属性、去除阴影

    模态框嵌套 在开发中,遇到需要通过点击事件触发第一个模态框,触发后通过事件唤起第二个模态框,并且通过事件触发第三个模态框:即模态框嵌套. 模态框嵌套需要用一个模态框包裹所涉及嵌套的模态框,从而点击触发 ...

  9. HTML tabindex 属性

    tabindex 属性规定元素的 tab 键控制次序(当 tab 键用于导航时).

随机推荐

  1. 使用Mybatis-Generator自动生成Dao、Model、Mapping相关文件(转)-----https://www.cnblogs.com/smileberry/p/4145872.html

    https://www.cnblogs.com/smileberry/p/4145872.html 使用Mybatis-Generator自动生成Dao.Model.Mapping相关文件(转)

  2. HDOJ 5402 Travelling Salesman Problem 模拟

    行数或列数为奇数就能够所有走完. 行数和列数都是偶数,能够选择空出一个(x+y)为奇数的点. 假设要空出一个(x+y)为偶数的点,则必须空出其它(x+y)为奇数的点 Travelling Salesm ...

  3. 【转】gcov lcov 覆盖c/c++项目入门

    原文: http://www.cnblogs.com/turtle-fly/archive/2013/01/09/2851474.html ------------------------------ ...

  4. 闲聊ROOT权限——ROOT权限的前世今生

    近期工作一直非常忙.居然慢慢地疏远了CSDN的博客,然而在工作中遇到问题,又会被多次的引导至CSDN,故笔者抽出时间也将自己学习的成果与大家分享在这里,希望能帮助到须要帮助的人. 本文将从几个方面,由 ...

  5. varnish代理server笔记

    varnish是一款开源的代理server软件.和Squid的差别是採用内存进行数据缓存. 速度很的快,并且不easy崩溃.可是奔溃之后全部数据都消失,导致全部请求全部发送至后台server端,这是其 ...

  6. HDU 1242 -Rescue (双向BFS)&amp;&amp;( BFS+优先队列)

    题目链接:Rescue 进度落下的太多了,哎╮(╯▽╰)╭,渣渣我总是埋怨进度比别人慢...为什么不试着改变一下捏.... 開始以为是水题,想敲一下练手的,后来发现并非一个简单的搜索题,BFS做肯定出 ...

  7. jdk1.6下使用sardine和jackrabbit-webdav的问题

    同步一个遇到的问题,前几天,客户给了一个server地址和usernamepassword.让把上面的文件,download到还有一台server上.我查了下,发现该server使用文件协议是webd ...

  8. Hibernate基于注解的双向one-to-many映射关系的实现

    在项目中用到了一对多的实体类关系映射,之前接触的都是基于配置文件的映射实现.可是公司的大部分都是基于注解的.因此自己參考之前的代码捣鼓了基于注解的一对多的映射关系实现. 背景: 一的一端:QingAo ...

  9. Android 应用按返回键异常退出的问题

    开发过程中遇到按返回键异常退出的问题,log显示为空指针异常,进一步产看是由于onActivityResult得到的Intent为空. 按返回键复写代码例如以下: @Override public v ...

  10. 假期(MySQL相关)

    """ 一.初始数据库: - 数据库管理软件的由来 四个字:存储数据(简单暴力) - 数据库概述 :什么是数据:简单的说就是描述事物的记录称为数据:可以是数字,文字,图片 ...