TabIndex就是按Tab键有顺序的获取定义过的TabIndex元素设置在各个元素之间的焦点。
TabIndex就是按Tab键有顺序的获取定义过的TabIndex元素设置在各个元素之间的焦点。

  做过表单或者填写过表单的人都会发现,使用Tab键可以逐一获得每个input的焦点。这个东东其实也是可以修改的,比如不想被获取,或者改变被获取的顺序。

  在填写表单的时候(注册登录或其它),有很多用户都是不通过鼠标,而直接按Tab键跳到下一个文本框的,等到所有的东东都填好,然后是提交,这是一个非常好和方便的功能。我个人的习惯是,在填写完所有的东西时,提交一般都是用鼠标去点击提交按钮的,而且不希望Tab会使焦点跳到button上面,但我很少发现有使用Tab不会跳到button上的,不知道是不是个人习惯太BT了-_-!!!

  如果不想某个东东被获取焦点,可以tabindex=-x,让tabindex的值为负,这样的话Tab就会直接跳过。

下面用一个简单的表单做例:



<script language="JavaScript">ffcod = delpost.runcode11 .value; ffcod = ffcod.replace(/
/g,''); delpost.runcode11 .value = ffcod;</script> 提示:您可以先修改部分代码再运行

 
<form method="post" action="#">
<p><label for="t1">The first pressing Tab to set focus to textbox </label><input type="text" id="t1" tabindex="1" /></p>
<p><label for="t2">The Second pressing Tab to set focus to textbox </label><input type="text" id="t2" tabindex="2" /></p>
<p><label for="t3">The Third pressing Tab to set focus to textbox </label><input type="text" id="t3" tabindex="3" /></p>
<p>Press Tab, Not focusing to textbox <input type="submit" id="t4" tabindex="-1" value="SendInfo" /></p>
</form>

  使用Tab键,获取焦点的顺序就是通过tabindex的值大小来排序的。上面的例子依次获得焦点的是t1, t2, t3, 到t4的时候,由于TabIndex的值为-1,所以t4不会获得焦点,而是直接跳到下一个获取焦点的元素上。
  t1, t2, t3, t4的TabIndex值可以根据实际需求任意更改,Tab焦点根据值由小到大被获得。
TabIndex就是用来做这些滴。。。
最新资讯
柳青:移动出行的渗透率只有3% 未来大有可为

柳青:移动出行的渗透率

在今日举行的花小猪媒体开放日上,滴滴出行总裁柳青分享
花小猪孙枢:希望满足更多用户需求 90后用户占六成

花小猪孙枢:希望满足更

滴滴今日举行花小猪打车媒体开放日,花小猪打车总经理孙
欧盟最新规定!大型科技公司或需交出包括广告档案等数据

欧盟最新规定!大型科技

据悉,欧盟数字事务主管Margrethe Vestager周五表示,根据
港交所:推出蚂蚁科技集团股份有限公司股票期权

港交所:推出蚂蚁科技集

港交所:推出蚂蚁科技集团股份有限公司股票期权。
特斯拉供应商LG化学获准分拆电池业务,拟一年内上市

特斯拉供应商LG化学获

据报道,LG化学(LG Chem)股东今日投票,批准了公司分拆电池
三六零:前三季度营收为79.74亿元,同比下降16.26%

三六零:前三季度营收为

三六零发布2020年第三季度财报。财报显示,前三季度,三六
最新文章
浅析html webpack plugin插件的使用教程

浅析html webpack plu

这篇文章主要介绍了html webpack plugin插件的使用教
HTML转PDF的纯客户端和纯服务端实现方案

HTML转PDF的纯客户端

这篇文章主要介绍了HTML转PDF的纯客户端和纯服务端实
HTML行内元素与块级元素有哪些及区别详解

HTML行内元素与块级元

这篇文章主要介绍了HTML行内元素与块级元素有哪些及区
html+css 实现图片右上角加删除叉、图片删除按钮

html+css 实现图片右

这篇文章主要介绍了html+css 实现图片右上角加删除叉
详解iframe的src指向的内容不刷新的解决办法

详解iframe的src指向

这篇文章主要介绍了详解iframe的src指向的内容不刷新
浅析HTML 悬浮float的用法

浅析HTML 悬浮float的

float的用途比较广, 本文主要给大家介绍HTML 悬浮floa