HTML捕获Enter键和Tab键

Question

I want to prevent the enter key from submitting the form, I want it to act as a TAB key to just jump to the next field in the form or the next element. 我想防止Enter键提交表单，我希望它充当TAB键，以仅跳转到表单中的下一个字段或下一个元素。

Is this possible in HTML/JS? HTML / JS有可能吗？

if not possible to make the enter button act as a tab, is there a way to prevent the submission of the form and make only the form be submitted using the buttons on the HTML?? 如果无法使enter按钮充当选项卡，是否有一种方法可以防止提交表单，而仅使用HTML上的按钮提交表单？

EDIT: 编辑：

I have received a solution to this problem when I was asking for another problem! 当我要求另一个问题时，我已经收到了针对该问题的解决方案！

here you can find the solution. 在这里您可以找到解决方案。

Answer 1

For accessibility/usability reasons, you really shouldn't prevent the Enter key from submitting the form (assuming the browser was going to do that anyway; IIRC, some older browsers didn't). 出于可访问性/可用性的原因，您实际上不应该阻止Enter键提交表单（假设浏览器无论如何都会这样做； IIRC，某些较旧的浏览器则不会这样做）。

Assuming that you want to do this because the submit button has a click handler you'd like to happen for every form submission, you should instead move that code into a separate function and invoke it from a the form's submit event. 假设您要执行此操作是因为对于每个表单提交，“提交”按钮都具有一个click处理程序，那么您应该将该代码移到一个单独的函数中，并从表单的submit事件中调用它。

In jQuery, it would look something like: 在jQuery中，它看起来像：

$('#myForm').submit(function(e) {
        if (!isValid()) {
            e.preventDefault();  // Could also be `return false;` but I prefer preventDefault.
        }
});

See the docs . 请参阅文档。

FYI, if you're trying to do some validation, you should check out the validation plugin . 仅供参考，如果您要进行一些验证，则应查看验证插件。

Answer 2

It might be possible to solve this using some jQuery - although I don't know how to imitate a keypress. 也许可以使用一些jQuery解决此问题-尽管我不知道如何模仿按键。

$(document).keyup(function(e) {
  if(e.keyCode == 13)
  {
    //Code to imitate keypress of Tab key
  }
});

Edit: Made a quick jsFiddle to "imitate" tab presses, which would go to the next field like you mentioned. 编辑：快速jsFiddle来“模拟”选项卡按，这将转到您提到的下一个字段。 (This one works based on the Enter key being pressed in a field) （此功能基于在字段中按下Enter键的作用）

jsFiddle 的jsfiddle

Answer 3

<html>
<body>
<script>
function tmpFn(val){
    if(event.keyCode=='13'){
    if (val<4)
        document.forms["yourform"].elements["box" + (val+1)].focus();
    else
        document.yourform.submit();
    return false;
    }
    return true;
}
</script>
<body>
<form name="yourform" action="#">
<input type="text" name="box1" onkeypress="return tmpFn(1)"><br>
<input type="text" name="box2" onkeypress="return tmpFn(2)"><br>
<input type="text" name="box3" onkeypress="return tmpFn(3)"><br>
<input type="text" name="box4" onkeypress="return tmpFn(4)"><br>
<input type="submit" name="done" value="Submit">
</form>
</body>
</html>

EDIT : Refrain from using 'eval'.. Thanks Tim and Andy! 编辑：不要使用'eval'..谢谢蒂姆和安迪！

Answer 4

Off the top of my head, to prevent the enter button from submitting the form, don't use a submit button, rather use a <input type="button" ... onclick="submitForm();"> to call javascript to submit the form. 为了防止回车按钮提交表单，不要使用提交按钮，而是使用<input type="button" ... onclick="submitForm();">来调用javascript提交表格。 I could be wrong, but I believe this should prevent pressing enter on any other element submitting the form. 我可能是错的，但是我认为这应该防止在提交表单的任何其他元素上按回车键。

HTML捕获Enter键和Tab键

问题描述

4 个解决方案

解决方案1
2 2011-01-04 16:53:55

解决方案2
1 2011-01-04 16:17:42

解决方案3
1 2011-01-04 16:36:00

解决方案4
0 2011-01-04 16:23:32

HTML捕获Enter键和Tab键

问题描述

4 个解决方案

解决方案1 2 2011-01-04 16:53:55

解决方案2 1 2011-01-04 16:17:42

解决方案3 1 2011-01-04 16:36:00

解决方案4 0 2011-01-04 16:23:32

解决方案1
2 2011-01-04 16:53:55

解决方案2
1 2011-01-04 16:17:42

解决方案3
1 2011-01-04 16:36:00

解决方案4
0 2011-01-04 16:23:32