0

我有两个文本字段的表单,onLoad="document.forms.obrazac.sifra.focus()"我将光标放在第一个字段上。现在我想当用户按下回车键将光标聚焦在第二个字段上,然后当再次按下回车时我想提交我的表单。我该怎么做,谢谢。

4

4 回答 4

2

打破默认行为绝对不好。顺便说一句,你知道autofocusHTML 中的属性吗?

如果你绝对需要这个,你去:

document.forms.obrazac.onkeypress = function( e ) {
    // If the hit key is "Enter"
    if ( e.keyCode === 13 ) {

        // Cross-browser handling for our dear friend @MaxArt :p
        var evt = e || window.event,
            target = evt.target || evt.srcElement,

        // Find the next input
            nextInput = target.nextSibling;
        while ( nextInput.tagName !== 'INPUT' && nextInput.nextSibling ) {
            nextInput = nextInput.nextSibling;
        }

        // And focus it
        nextInput.focus();

        // Finally, disable submitting IF there is no input after
        if ( nextInput !== this.elements[ this.elements.length - 1 ] ) {
            return false;
        }
    }
};
于 2012-05-22T14:45:31.020 回答
1

只是一个简短的不是真正的测试样本......只是给你一个想法:

<head>
    <script type="text/javascript">
    function onKeyPress(args)
    {
        if(args.keyCode === 13)
            document.getElementById("tb2").focus();
    }       
    </script>
</head>
<body>
    <input type="text" onkeypress="onKeyPress(event);" id="tb1" />
    <input type="text" id="tb2" />
</body>

您可以在 tb2 上执行相同的操作以在“ENTER”上提交表单。我还将使用 jQuery 之类的东西在 javascript 中绑定事件,而不是直接在标记中。

希望能帮助到你。

@as 我已经开始在没有答案的地方创建我的样本 =)

于 2012-05-22T15:07:21.717 回答
0

我不会破坏默认行为,这对用户来说非常烦人和违反直觉,但如果你真的想这样做,你可以用 jquery 做这样的事情:

$('#form').keydown(function(e) {
    if( e.keyCode === 13) {  // When "Shift + Enter"
        e.preventDefault();
        // focus on next field here.
    }
});

与其这样做,不如像这样(使用 tabindex)制作正确的标签顺序:

<input type="text" name="field1" tabindex=1 /><br />
于 2012-05-22T14:48:39.760 回答
-1

尝试这个:

document.forms.obrazac.sifra.addEventListener("keyup", function(e) {
    if (e.keyCode === 13) { // 13 === enter key
        e.preventDefault();
        this.nextSibling.focus();
    }
});

注意这些事情:

  1. 我使用过addEventListener,但在 IE8 和更早版本中,您必须使用attachEvent("onkeyup"...并检查全局event对象。此外,e.preventDefault();成为e.returnValue = false;
  2. 我想那this.nextSibling是下一个领域。更正此以适合您的 DOM。
于 2012-05-22T14:46:55.733 回答