Onsubmit prevents form submission and onclick-related operations

Source: Internet
Author: User

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

Copy codeThe Code is as follows:
Function chkinput (form)
{
If (form. title. value = "")
{
Alert ("Enter the article title! ");
Form. title. select ();
Return false;
}

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:

Copy codeThe Code is as follows:
<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. One of them should be changed to the following code:
<Form action = "index. jsp "method =" post "onsubmit =" return submitTest (); "> the original onsubmit attribute is like a method name of the <form> html object, and its value (a string) is the method body, and true is returned by default;
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 a <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 continues to execute its default event and submits 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 this way: first, comment out all js scripts, and drag a piece in IE browser. You will find that the mouse will become a forbidden style, and the picture will be not 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>

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.