text box get focus after click Return submit and do not submit

Source: Internet
Author: User
Tags button type



When the text box gets the focus, click Enter to submit and not submit:
In some cases, for convenience, there may be such a need, that is, when the text box in the form to get focus, click Enter ENTER to achieve the form submission function, but sometimes we do not want to have similar functions, such as the form is relatively large, painstakingly filled out a half-day form, a return error operation, Causing the form to submit. Implementing both of these features usually uses JavaScript, which can be roughly done with CSS.
(1). When a text box, the Submit button type either submit or button, the text box gets the focus, click Enter to submit:
[HTML] Plain text view copy code run code 1 2 3 4 < form action = "http://www.softwhy.com" > < input type = "Text" > < in Put type = "button" value = "Submit" > </form >
(2). When a text box can be done without submitting, the method is to add a hidden text box:
[HTML] Plain text view copy code run code 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "Text" > < INPUT type = "text" style = "Display:none" > < INPUT type = "button" value = "Submit" > </form >
(3). As long as there is a button with type submit, a text box or multiple text boxes are submitted:
[HTML] Plain text view copy code run code 1 2 3 4 < form action = "http://www.softwhy.com/" > < input type = "Text" > < I Nput type = "submit" value = "Submit" > </form >
The case above is a text box.
[HTML] Plain text view copy code run code 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "Text" > < INPUT type = "text" > < input type = "submit" VALUE = "submitted" > </form >
The above is a case of multiple text boxes.
(4). When multiple text boxes are not submitted, the buttons with type button can be used:
[HTML] Plain text view copy code run code 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "Text" > < INPUT type = "text" > < INPUT type = "button" value = "Submit" > </form >
(5). Type is an image of the button, equivalent to the type is the effect of submit:
[HTML] Plain text view copy code run code 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "Text" > < INPUT type = "text" > < input type = "image" src = "images/antzone.jpg" > </form >
Summarized as follows:
(1). If there is a type= "submit" button in the form, the ENTER key takes effect.
(2). If there is only one type= "text" Input in the form, the ENTER key takes effect regardless of the type of the button.
(3). If the button is not made with input, it is type,ie with a button, and the default is TYPE=BUTTON,FF default is Type=submit.
(4). Other form elements such as textarea, select Do not affect, radio checkbox does not affect the trigger rule, but itself in FF will respond to enter, under IE does not respond.
(5). type= "image" input, the effect is equivalent to type= "submit", do not know why the design of such a type, not recommended, you should use CSS to add a background map appropriate.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.