ASP. by default, the webform will be submitted when the cursor is pressed back in the text box. Most of the time, it does bring a good user experience. After entering data, you do not have to leave the key to touch the mouse to submit the form. But there are always exceptions that do not require such default behaviors. You must know when you encounter them. For example, if you want to press enter in the text box to do other things, you should be skillful.
Many may tell you to add an event to the text box. When you press enter, the keycode is changed from 13 to 9 (in fact, the keycode is changed to 9 to make the press ENTER equivalent to the tab key function ), but before you finish, you have not prevented the situation from spreading further, and the form is submitted.
$ (Document). Ready (function (){
$ ("# TXT"). keypress (function (event ){
If (event. keycode = 13 ){
Event. keycode = 9;
// Do some of your things
}
});
});
In fact, you need to slightly understand the browser's bubble event model, know how to block the browser's default behavior in a timely manner, there is a linkHttp://kb.cnblogs.com/a/1363417/It is worth noting that the content is as follows:
In front-end development, due to browser compatibility and other issues, we often use "Stop event bubbling" and "Block browser default behavior ".
1. Stop event bubbling
JavascriptCode
// If the event object is provided, this is a non-IE browser
If (E & E. stoppropagation)
// Therefore, it supports the W3C stoppropagation () method.
E. stoppropagation ();
Else
// Otherwise, we need to use IE to cancel event bubbling.
Window. event. cancelbubble = true;
Return false;
2. prevent default browser behavior
JavaScript code
// If the event object is provided, this is a non-IE browser
If (E & E. preventdefault)
// Block the default browser action (W3C)
E. preventdefault ();
Else
// Block the default action of the function in IE
Window. event. returnvalue = false;
Return false;
In this case, when you press enter in the keyboard event of the text box, the next default behavior of the browser will be blocked. browsers of higher versions tend to be normalized, therefore, you can use E. preventdefault (); method. Add the following code to the text box on your webpage:
$ (Document ). ready (function () {$ ("# TXT "). keypress (function (event) {If (event. keycode = 13) {event. preventdefault (); // do some of your things }});});
The above Code uses the most popular jquery to append event functions. In this way, you can try again, in IE7/IE8 compatible mode, in the opera or Firefox text box, press the carriage back and no longer submit the form.
For ie browsers, use window. event. returnvalue = false; to replace event. preventdefault (); is also possible. In fact, it is not necessary to add a browser to judge the window. event. returnvalue = false; it is also safe. It is also convenient to use jquery to determine the browser. Note that it is not an event. returnvalue = false; oh, there are no windows.
Of course, if there is no submit button in the form, it will not be submitted at any time in the text box, and a submit button will be added. This default behavior can be obtained in the text box even after a hidden submit button. So this gives us
Another solution is to change the submit button to the normal button and add onclick = "This. Form. Submit ()" to the normal button ()" You can.
There are three methods to summarize: 1. add a keydown event to the text box to prevent the browser from submitting the event by default. the submit button is changed to the normal button, and the form is submitted in onclick 3. adding a hidden Password box to the form can also achieve this effect.
In addition, adding an invisible <input type = "password" style = "display: none"> to the form can also lead to pressing the carriage return without submitting the form. .
Appendix:
In fact, jquery can be used to load files at any time, anywhere, and directly through Google CDN. There is no need to worry about whether Google will be taken away, but it will only be possible to get rid of the wall.
reference: http://code.google.com/apis/libraries/devguide.html#jquery ,
use load the jquery library
or use: >,
First comeGoogle API keyRegister a key and place it in the insert-your-Key location. Then, you can use the following code to load any script library you want at any time:
Google. Load ("Chrome-frame", "1.0.2 ");
Google. Load ("Fig", "1.5 ");
Google. Load ("ext-core", "3.1.0 ");
Google. Load ("jquery", "1.4.2 ");
Google. Load ("jqueryui", "1.8.2 ");
Google. Load ("mootools", "1.2.4 ");
Google. Load ("prototype", "1.6.1.0 ");
Google. Load ("scriptaculous", "1.8.3 ");
Google. Load ("swfobject", "2.2 ");
Google. Load ("Yui", "2.8.1 ");
Google. Load ("webfont", "1.0.6 ");
----------------------------------------------------------------------
Keydown event
This function calls and executes all the functions bound to the keydown event, including the default behavior of the browser. You can return false in a bound function to prevent the browser from triggering the default behavior. The keydown event is triggered when the keyboard is pressed.
Operations performed by pressing enter on the page
$ (Document). keydown (function (e ){
E = e? E: window. event;
VaR keycode = E. Which? E. Which: E. keycode;
If (keycode = 13)
{
// Operation
Return false;
}
});