1. When there is only one <input type="text" name="name" /> in the form form, press Enter to automatically submit the form.
The code copy is as follows:
<form id="form1" action="post.php" method="post">
<input type="text" name="name" />
</form>
Add another one
The code copy is as follows:
<input type="text" />
Press Enter to submit it automatically, but it is awkward to display an unknown input box on the page. Later, I found two solutions from the Internet:
(1) Add one
The code copy is as follows:
<input style="display: none;" type="text" />
The input box is not displayed, and it will not be submitted after entering:
The code copy is as follows:
<form id="form1" action="post.php" method="post">
<input type="text" name="name" />
<input style="display:none" />
</form>
(2) Add an onkeydown event, and then press Enter and will not display:
The code copy is as follows:
<form id="form1" action="post.php" method="post">
<input type="text" name="name" onkeydown="if(event.keyCode==13) return false;"/>
</form>
If you want to add a carriage return event, you can add a judgment submission form in the onkeydown event:
The code copy is as follows:
<form id="form1" action="post.php" method="post">
<input style="display:none" />
<input type="text" name="name" onkeydown="if(event.keyCode==13){gosubmit();}" />
</form>
Sometimes we want the Enter key to submit the form in the input element, but sometimes we don't want it. For example, search behavior, you hope to press Enter to submit the form immediately after entering the keyword. For some complex forms, you may need to avoid the error operation of the Enter key and trigger the form submission when the form is filled in before the form is filled.
To control these behaviors, you don’t need to use JS. The browser has helped us with these processing. Here are a few rules:
If there is a type="submit" button in the form, the Enter key takes effect.
If there is only one input with type="text" in the form, no matter what type the button is, the Enter key takes effect.
If the button does not use input, but button, and no type is added, the default is type=button in IE, and the default is type=submit in FX.
Other form elements such as textarea and select do not affect, radio checkbox does not affect the triggering rules, but will respond to the Enter key under FX and will not respond in IE.
The input of type="image" has the same effect as type="submit". I don't know why this type is designed, and it is not recommended to use it. It should be appropriate to add background images using CSS.