我有一个PHP生成的表单,用作开票接口。用户按tab
即可完成表单。我需要在表单中旋转Tab键,直到他们完成开票流程。
例如,使用以下形式:
<form>
<input type = "text" name="a" tabindex=1>
<input type = "text" name="b" tabindex=2>
<input type = "text" name="c" tabindex=3>
<input type = "text" name="d" tabindex=4>
<input type = "text" name="e" tabindex=5>
<input type = "text" name="f" tabindex=6>
<input type = "button" name="g" tabindex=7>
<input type = "submit" name="h" tabindex=8>
</form>
我需要将选项卡索引从1移动到7,然后选项卡应将它们移回到字段a。它需要旋转,当我按下ESC时我需要将光标移动到h。
示例 -
TAB键将光标从a-> b-> c-> d-> e-&gt; f-> g-> a-> b-&gt; .. ....-&GT;克
ESC键只需将光标移动到h
如何在HTML或javascript中执行此操作?
答案 0 :(得分:2)
我用id而不是名字。猜猜这有帮助:
<form>
<input type = "text" id="a" tabindex=1/>
<input type = "text" id="b" tabindex=2/>
<input type = "text" id="c" tabindex=3/>
<input type = "text" id="d" tabindex=4/>
<input type = "text" id="e" tabindex=5/>
<input type = "text" id="f" tabindex=6/>
<input type = "button" id="g" value="next" tabindex=7/>
<input type = "submit" id="h" value="ok" tabindex=8/>
</form>
<script type="text/javascript">
$('input').keydown(function(event){
if(event.keyCode == 9 && $(event.target).is('#g') ){
$('#a').focus();
event.preventDefault();
}
else if (event.keyCode == 27){
$('#h').focus();
event.preventDefault();
}
});
</script>
答案 1 :(得分:0)
我在这个问题上使用了以下代码并获得了成功。
<script>
window.history.forward(1);
document.attachEvent("onkeydown", my_onkeydown_handler);
function my_onkeydown_handler()
{
switch (event.keyCode)
{
case 9 :
document.form.a.focus();
event.keyCode = 0;
break;
case 27 :
document.form.h.focus();
event.keyCode = 0;
break;
}
}
</script>