tabindex 属性 - HTML中代表使用"Tab"键的遍历顺序

来源:互联网 发布:mysql添加外键约束 编辑:程序博客网 时间:2024/05/15 23:06

tabindex 属性 -- 代表使用"Tab"键的遍历顺序
  可以使用Tab键遍历页面中的所有链接与表单元素,当遍历到某个链接时,按Enter即可进入该链接,相当于鼠标左键点击。遍历时会按照tabindex的大小决定顺序遍历到某个链接的时候,会有虚线框包围链接,这时按回车键即可进入链接的页面。
  取值: 数字 (可以是1、2、3、……)

示例展示:
1. 下面是超级连接中tabindex属性的使用:

 程序代码
<a href="http://www.shuihan.com/default.asp " tabindex="1">1</a>      
<a href="http://www.shuihan.com/default.asp ?cateID=7" tabindex="3">3</a>      
<a href="http://www.shuihan.com/default.asp ?cateID=17 " tabindex="2">2</a>
<a href="http://www.shuihan.com/default.asp ?cateID=5" tabindex="4">4</a>      
<!--连续按 "Tab",可以改变焦点的位置.遍历的顺序是1-2-3-4.-->



2. 下面是表单中tabindex属性的使用:

 程序代码
<form id="form1" name="form1" method="post" action="?act=save">
    <p>(*) 姓名:<input type="text" name="name" tabindex="1" /></p>
    <p>EMail:<input type="text" name="email" tabindex="2" /></p>
    <p>QQ:<input type="text" name="qq" tabindex="6" /></p>
    <p>电话:<input type="text" name="tel" tabindex="7" /></p>
    <p>(*) 标题:<input type="text" name="title" tabindex="3"/></p>
    <p>是否管理员可见:<input type="checkbox" name="isshow" tabindex="4" value="1" />选择后您的留言不公开,仅管理员可见。</p>
    <p>(*) 留言内容: <textarea name="neirong" cols="60" rows="6" tabindex="5"></textarea></p>
    <p><input type="submit" name="submit" value="提 交" tabindex="7" /></p>
</form>

引用自:http://www.shuihan.com/article.asp?id=317

怎样禁用TAB键?比如让<input id='text1' type='text'>禁用TAB

 

方法一:设置属性tabindex=-1就可以了。

方法二:<input   id='text1'   type='text'   onkeydown="if(event.keyCode==9){event.returnValue=false;}   ">