按Enter键时阻止表单提交[重复]

This question already has an answer here:

这个问题在这里已有答案：

How to prevent ENTER keypress to submit a web form? 27 answers
如何防止ENTER键提交Web表单？ 27个答案

I have a form with a disabled submit button. Even though the user can't press this button, he can still hit Enter to submit the form. How do I prevent that?

我有一个带有禁用提交按钮的表单。即使用户无法按下此按钮，他仍然可以按Enter键提交表单。我该如何预防呢？

7 个解决方案

#1

Assuming HTML:

假设HTML：

<form id="myForm"> ...

You can do this with JavaScript:

你可以用JavaScript做到这一点：

document.getElementById("myForm").onsubmit = function () {
    return false;
};

#2

If you want to completely disable the form submit (However I am wondering why the whole <form> element is then there in first place), then you need to let its submit event handler return false.

如果你想完全禁用表单提交（但是我想知道为什么整个

So, basically:

所以，基本上：

<form onsubmit="return false;">

You can add it using Javascript/DOM manipulation during onload as previous answerers pointed out.

您可以在onload期间使用Javascript / DOM操作添加它，正如之前的回答者指出的那样。

If you only want to disable the Enter key to submit the form, then you need to let its keypress event handler return false when the keycode matches 13 (this one is crossbrowser compatible!).

如果你只想禁用Enter键来提交表单，那么当keycode匹配13时，你需要让它的keypress事件处理程序返回false（这个是与crossbrowser兼容的！）。

<form onkeypress="return event.keyCode != 13;">

This however also disables the Enter key in any <textarea> elements in the form. If you have any of them and you would like to keep them functioning, then you'll need to remove the onkeypress from the <form> and copy it over all <input> and <select> elements. jQuery can be helpful in this:

但是，这也会禁用表单中任何元素中的Enter键。如果你有任何一个并且你想让它们保持正常运行，那么你需要从

$('input, select').keypress(function(event) { return event.keyCode != 13; });

#3

Instead of implementing two methods of disabling form submitting, add an event handler to form's onsubmit which will check the disabled property of the button:

不是实现两种禁用表单提交的方法，而是在表单的onsubmit中添加一个事件处理程序，它将检查按钮的disabled属性：

myForm.onsubmit = function () { 
    if (myForm.mySubmit.disabled) 
        return false;
}

#4

Say you had a form with an id of "myForm":

假设你有一个id为“myForm”的表单：

<form id="myForm" action="some_file" method="post">
   ...
</form>
<script type="text/javascript">
    document.getElementById( "myForm").onsubmit = function() {
          return false;
    };
    //or with jQuery: $( '#myForm' ).submit( function() { return false; } );
</script>

#5

If you don't want to edit the onsubmit event of the form, you can do it like this.
Add this to the text input:

如果您不想编辑表单的onsubmit事件，可以这样做。将其添加到文本输入：

onKeyPress="return noEnter(event)"

And this to the header:

这个标题：


    function noEnter(e)
    {
        var key;
        // firefox vs. ie
        (window.event) ? key = window.event.keyCode : key = e.which;
        (key == 13) ? return false : return true;
    }

easier to pull of with jquery.

用jquery更容易拉动。

#6

jQuery Solution:

jQuery解决方案：

$(document).ready(function(){
  $('form[name="form"]').keypress( function(evt){
    return !(evt.which==13 && evt.target.type!='textarea');
  });
  $('form[name="form"] input[type="submit"]').attr('tabIndex',-1); // this prevents submit also by spacebar (keyCode==32)
  //$('form[name="form"]').submit(function(){ alert('test'); return false; }); // test
});

#7

document.getElementById("myForm").onsubmit = function () {
    return false;
};

These codes doesn't work on Chrome and Safari. It submits form to action url.

这些代码在Chrome和Safari上无效。它将表单提交给操作URL。

But <form onsubmit="return false;"> is useful.

但

#1