87,904
社区成员
发帖
与我相关
我的任务
分享求一个用tab键来控制切换各个标签的焦点
求一个用tab键来控制切换各个标签的焦点（比如输入框），不只是输入框，也可以是不同div之间的，也可以是div和输入框之间的，就是各个标签之间都可以切换焦点（光标所在位置），最好有代码，谢谢大家！
...全文
请发表友善的回复…
发表回复
myeclipse0123 2010-04-16
- 打赏
- 举报
大家没有人可以帮我吗？只有输入框之间的切换就可以了，这样的代码应该比较简单吧，我是初学者
cocoanet 2010-04-16
- 打赏
- 举报
看我上面8楼的方法，设置tabindex即可实现tab切换顺序，用JS可以控制下一跳的位置。。。。。
千游 2010-04-16
- 打赏
- 举报
输入框 之间用tab 切换 不是自动吗
shan1119 2010-04-16
- 打赏
- 举报
<script type="text/javascript">
window.onload=function(){
var obj=document.getElementsByTagName("input");
for(var i=0;i<obj.length;i++){
(function(){
var index=i;
obj[index].onkeydown=function(){
obj[index<obj.length-1?index+1:0].focus();
return false;
};
})();
}
};
</script>
<input/>
<input/>
<input/>
<input/>
<input/>
<input/>
passself 2010-04-16
- 打赏
- 举报
在很多情况下，默认的时候就是用tab键来切换的，不过其他标签的如div之类的就不好说了，只能把id设置成递增或者递减的
cocoanet 2010-04-16
- 打赏
- 举报
<html>
<head>
<title></title>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
<style type="text/css">
div{
width:20px;
height:20px;
border:1px solid red;
margin-bottom:10px;
}
</style>
<script>
function tabGoHome(){
document.getElementById("firstSelectd").focus();
}
function stopEvent(e)
{
if(e.stopPropagation)
{
e.stopPropagation();
}
else
{
e.cancelBubble=true;
}
if(e.preventDefault)
{
e.preventDefault();
}
else
{
e.returnValue=false;
}
}
function check(e)
{
e = e || window.event;
target = e.srcElement||e.target;
keyCode = e.keyCode;
if(9 == keyCode)
{
if("lastSelectd" == target.id)
{
stopEvent(e);
tabGoHome();
}
}
}
</script>
</HEAD>
<BODY onload = "tabGoHome()" onkeydown = "check(event)" >
<div id="firstSelectd" tabindex = "1">1</div><!-- 焦点 最初 停留的元素-->
<div tabindex = "2">2</div>
<div id="lastSelectd" tabindex = "7">7</div><!-- 焦点 最后 停留的元素-->
<div tabindex = "4">4</div>
<div tabindex = "5">5</div>
<input type="text" tabindex = "6" />
</BODY>
</html>myeclipse0123 2010-04-16
- 打赏
- 举报
js牛人哪？都不在了吗？
myeclipse0123 2010-04-15
- 打赏
- 举报
只有input输入框切换也行，谢谢
tgl_sql 2010-04-15
- 打赏
- 举报
function Move(e,Event)
{
var id = e.id;
if(Event.keycode == 37) //左 39右 38上 40 下
｛
document.getElementById(id.replace("开始Id","移动后的Id")).select();
｝
}
调用控件设置onkeyup事件
onkeyup="Move(this,event)"
flesu 2010-04-15
- 打赏
- 举报
动态生成一个透明的文本框试试，如果有表单控件就不生成。
共享to未来 2010-04-15
- 打赏
- 举报
有点难度！顶！！！！
hoojo 2010-04-15
- 打赏
- 举报
呵呵，div也要，有点复杂。这个和html定义规范有关
