说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

一个遍历text控件的问题

编辑:说三道四文库 发布时间:2018-05-21 03:26
HTML文档下载 WORD文档下载 PDF文档下载
    问题:现有10行4列的表格,每个cell里放了一个text控件,用于显示和修改数据。条件是两边两列的数据不能修改,中间两列的数据可以修改。现我要得到如下两种效果:1、当按下Tab键时光标能在中间两列的text控件依次移动;2、按上下键时光标能在同列不同行的text控件之间移动。

    谢谢!
<form>
<input type=text tabindex=1>
<input type=text tabindex=2><br>
<input type=text tabindex=3>
<input type=text tabindex=4><br>
<input type=text tabindex=5>
<input type=text tabindex=6><br>
</form>
<script>
function arrow(field){
if(event.keyCode==40)
if(!(field<document.form1.elements.length-2))
form1.elements[0].focus()
else
form1.elements[field+2].focus()

if(event.keyCode==38)
if(field<2){
if(field==1)
form1.elements[1].focus()
}
else
form1.elements[field-2].focus()

}
</script>
<form name=form1>
<input type=text name=txt1 tabindex=1 onkeydown="arrow(0)">
<input type=text name=txt2 tabindex=2 onkeydown="arrow(1)"><br>
<input type=text name=txt3 tabindex=3 onkeydown="arrow(2)">
<input type=text name=txt4 tabindex=4 onkeydown="arrow(3)"><br>
<input type=text name=txt5 tabindex=5 onkeydown="arrow(4)">
<input type=text name=txt6 tabindex=6 onkeydown="arrow(5)"><br>
<input type=text name=txt7 tabindex=7 onkeydown="arrow(6)">
<input type=text name=txt8 tabindex=8 onkeydown="arrow(7)"><br>
<input type=text name=txt9 tabindex=9 onkeydown="arrow(8)">
<input type=text name=txt10 tabindex=10 onkeydown="arrow(9)"><br>
<input type=text name=txt11 tabindex=11 onkeydown="arrow(10)">
<input type=text name=txt12 tabindex=12 onkeydown="arrow(11)"><br>
<input type=text name=txt13 tabindex=13 onkeydown="arrow(12)">
<input type=text name=txt14 tabindex=14 onkeydown="arrow(13)"><br>
<input type=text name=txt15 tabindex=15 onkeydown="arrow(14)">
<input type=text name=txt16 tabindex=16 onkeydown="arrow(15)"><br>
<input type=text name=txt17 tabindex=17 onkeydown="arrow(16)">
<input type=text name=txt18 tabindex=18 onkeydown="arrow(17)"><br>
<input type=text name=txt19 tabindex=19 onkeydown="arrow(18)">
<input type=text name=txt20 tabindex=20 onkeydown="arrow(19)"><br>
</form>
完美解答版代码:
========================================================================
<script>
function arrow(field){
if(event.keyCode==40)
if(!(field<document.form1.elements.length-2)){
if(field%2==0)
form1.elements[0].focus()
else
form1.elements[1].focus()
}
else
form1.elements[field+2].focus()
if(event.keyCode==38)
if(field==1||field==0)
{
if(field%2==0)
form1.elements[18].focus()
else
form1.elements[19].focus()
}
else
form1.elements[field-2].focus()
}
</script>
<form name=form1>
<input type=text name=txt1 tabindex=1 onkeydown="arrow(0)">
<input type=text name=txt2 tabindex=2 onkeydown="arrow(1)"><br>
<input type=text name=txt3 tabindex=3 onkeydown="arrow(2)">
<input type=text name=txt4 tabindex=4 onkeydown="arrow(3)"><br>
<input type=text name=txt5 tabindex=5 onkeydown="arrow(4)">
<input type=text name=txt6 tabindex=6 onkeydown="arrow(5)"><br>
<input type=text name=txt7 tabindex=7 onkeydown="arrow(6)">
<input type=text name=txt8 tabindex=8 onkeydown="arrow(7)"><br>
<input type=text name=txt9 tabindex=9 onkeydown="arrow(8)">
<input type=text name=txt10 tabindex=10 onkeydown="arrow(9)"><br>
<input type=text name=txt11 tabindex=11 onkeydown="arrow(10)">
<input type=text name=txt12 tabindex=12 onkeydown="arrow(11)"><br>
<input type=text name=txt13 tabindex=13 onkeydown="arrow(12)">
<input type=text name=txt14 tabindex=14 onkeydown="arrow(13)"><br>
<input type=text name=txt15 tabindex=15 onkeydown="arrow(14)">
<input type=text name=txt16 tabindex=16 onkeydown="arrow(15)"><br>
<input type=text name=txt17 tabindex=17 onkeydown="arrow(16)">
<input type=text name=txt18 tabindex=18 onkeydown="arrow(17)"><br>
<input type=text name=txt19 tabindex=19 onkeydown="arrow(18)">
<input type=text name=txt20 tabindex=20 onkeydown="arrow(19)"><br>
</form>
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘