Javascript: onsubmit = return false block form submission

Source: Internet
Author: User

Return false: Blocking form submission does not work. Today, this problem has plagued me for a long time. I have found a lot of information on the Internet. Basically, the following points should be noted about onsubmit = return false:
 
1. For the return value problem, once a return value exists in the function, the following statement is not executed and the return value directly jumps to the place where the function is called. In the following PHP function code, if the first if condition matches, the function value returns a Boolean false value, which can return the value of a function and jump out of the function. if you encounter a return statement, the program stops execution in that line of code, and the execution control will immediately return to the code that calls the program.
 
Function chkinput (form)
{
If (form. title. value = "")
{
Alert ("Enter the article title! ");
Form. title. select ();
Return false; // note that return (false) cannot be written; 2009.12.15
}
 
If (form. content. value = "")
{
Alert ("the text cannot be blank @!! ");
Form. content. select ();
Return false;
}
 
Return true;
}
2. When will the onsubmit event be triggered when the onsubmit attribute of form is triggered? The onsubmit event occurs when the confirmation button in the form is clicked. The reasons for not triggering are as follows:
 
A. The onsubmit attribute will be triggered only when the form uses A button such as input: submit to submit. Otherwise, it will not be triggered. If a common input: button is used, a javascript function is specified in the onclick attribute. In this function, the submit () function of form is executed instead of the onsubmit attribute.
 
B. First read a piece of code:
 
<Form action = "index. jsp" method = "post" onsubmit = "submitTest ();">
<INPUT value = "www">
<Input type = "submit" value = "submit">
</Form>
<Script language = "JavaScript">
<! --
Function submitTest (){
// Some logic determines return false;
}
// --> </SCRIPT>
Click the submit button. This form is not submitted. Because one of them should be changed to the (red font)
 
<Form action = "index. jsp" method = "post" onsubmit = "return submitTest ();">
 
The onsubmit attribute is like a method name of the <form> html object. Its value (a string) is its method body. By default, true is returned;
 
Like Java, you can write any number of statements in the method body, including built-in functions and custom functions.
 
Although submitTest () returns false, we only execute this function and do not process the result.
 
Onsubmit = "return submitTest () uses its return value to achieve the expected results.
 
3. The event handler function returns false. In most cases, false is returned for the event handler function, which can prevent default event behavior.
 
For example, if you click an <a> element by default, the page will jump to the page specified by the href attribute of the element.
 
Return False is equivalent to the Terminator, and Return True is equivalent to the executable.
 
In js, return false is generally used to cancel the default action. For example, when you click a link, in addition to triggering your onclick time (if you specify it), you also need to trigger a default event that is to execute the page Jump. So if you want to cancel the default action of an object, you can return false. Return false:
 
<Body>
1, <a href = "/" mce_href = "/" onclick = 'test (); '> hyperlink </a>
2, <input type = "button" onclick = 'test () 'value = "Submit">
3, <form name = "form1" onsubmIT = "return test ();">
Content
<Input type = "submIT" value = "submIT">
</Form>
</Body>
<Input type = "submit" onclick = "submitAction (); return false;"/> the submitAction method contains an action to submit a form. If return false is not added, after the submitAction is executed, the submit button will continue to execute its default event and submit the form again. This may be the root cause of many errors.
 
Indeed, return false does not prevent the event from spreading to the top-level element, but prevents the browser from handling the event by default. You can try it like this:
 
First, comment out all js scripts and drag them to IE. You will find that the mouse will become a prohibited style, and the image will be dragged, it is the default behavior provided by the browser for the mousemove event.
 
Return false is to remove this behavior, otherwise the interrupted event you described will be executed continuously.
 
In addition, the statement equivalent to return false is:
 
Window. event. returnValue = false
 
You can replace return false with this statement for verification.
 
Finally, this method is only applicable to IE browsers.
 
In js, return false is generally used to cancel the default action. For example, when you click a link, in addition to triggering your onclick time (if you specify it), you also need to trigger a default event that is to execute the page Jump. So if you want to cancel the default action of an object, you can return false. Return false:
 
<Form name = "form1" onsubmit = "return youfunction ();">... </form>
<A href = "www. ****. com" onclick = "...; return false;"> dddd </a>
 
 
From nuclear'atk Network Security Research Center

Related Article

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.