Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

Detailed explanation of enter event rules in html form

2025-01-18 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

This article mainly explains "detailed explanation of enter event rules in html form". Interested friends may wish to have a look at it. The method introduced in this paper is simple, fast and practical. Next, let the editor take you to learn "detailed explanation of the rules of carriage return incident in html form".

Sometimes we want to type the enter key in the text box (input element) to submit the form (form), but sometimes we don't want to. For example, in the search behavior, you want to press enter to submit the form immediately after typing the keyword, while for some complex forms, you may want to avoid the wrong operation of enter key to trigger form submission when the form is not completed.

To control these behaviors, you don't need to use JS. Browsers have done this for us. 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 of type= "text" in the form, no matter what type the button is, the enter key takes effect.

If the button uses button instead of input and defaults to type=button without adding type,IE, FX defaults to type=submit.

Other form elements such as textarea and select do not respond. Radio checkbox does not affect the trigger rules, but it responds to the enter key under FX and does not respond under IE.

The input of type= "image" is equivalent to that of type= "submit". I don't know why such a type is designed and is not recommended. It is appropriate to use CSS to add a background image.

In practical application, it is easy to get the form to respond to the enter key, just make sure there is a type= "submit" button in the form. What if there is only one text box and you don't want to respond to the enter key? My method is a little awkward, which is to write another meaningless text box and hide it. According to rule 3, when using button, we try to explicitly declare type to make browsers behave consistently.

How can you avoid submitting a text box by adding a hidden text box?

As long as there is a button with type as submit, one or more text boxes are submitted.

As long as there is a button with type as submit, one or more text boxes are submitted.

When you have multiple text boxes, don't submit them, just use the button with type as button.

When using button elements, there are different behaviors under FX and IE

Submit

Radio and checkbox also trigger form submission under FX, but not under IE

Type is the button of image, which is equivalent to the effect that type is submit.

At this point, I believe you have a deeper understanding of the "detailed explanation of the enter event rules in html form". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report