小码哥的IT人生

HTML DOM tabIndex 属性

JavaScript基础 2022-06-08 15:38:14小码哥的IT人生shichen

HTML DOM tabIndex 属性

定义和用法

tabIndex 属性可设置或返回按钮的 tab 键控制次序。

语法

buttonObject.tabIndex=tabIndex

实例

下面的例子可返回按钮的 tab 键控制次序:

<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var b1=document.getElementById('b1').tabIndex;
  var b2=document.getElementById('b2').tabIndex;
  var b3=document.getElementById('b3').tabIndex;
  document.write("Tab index of Button 1: " + b1);
  document.write("<br />");
  document.write("Tab index of Button 2: " + b2);
  document.write("<br />");
  document.write("Tab index of Button 3: " + b3);
  }
</script>
</head>
<body>
<button id="b1" tabIndex="1">Button 1</button><br />
<button id="b2" tabIndex="2">Button 2</button><br />
<button id="b3" tabIndex="3">Button 3</button><br />
<br />
<input type="button" onclick="showTabIndex()"
value="Show tabIndex" />
</body>
</html>

TIY

完整实例【返回按钮的 tab 键控制次序】:

<html>
<head>
<script type="text/javascript">
function showTabIndex()
{
var b1=document.getElementById('b1').tabIndex;
var b2=document.getElementById('b2').tabIndex;
var b3=document.getElementById('b3').tabIndex;
document.write("Tab index of Button 1: " + b1);
document.write("<br />");
document.write("Tab index of Button 2: " + b2);
document.write("<br />");
document.write("Tab index of Button 3: " + b3);
}
</script>
</head>
<body>
<button id="b1" tabIndex="1">Button 1</button><br />
<button id="b2" tabIndex="2">Button 2</button><br />
<button id="b3" tabIndex="3">Button 3</button><br />
<br />
<input type="button" onclick="showTabIndex()" value="Show tabIndex" />
</body>
</html>

可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html

版权所有 © 小码哥的IT人生
Copyright © phpcodeweb All Rights Reserved
ICP备案号:苏ICP备17019232号-2  

苏公网安备 32030202000762号

© 2021-2024