OnSubmit block form submission and onclick related operations _javascript tips

Source: Internet
Author: User
1. Return returns the value problem, the function returns once has the return value, does not execute the following statement, jumps directly to the function call place. The following PHP function code, the first if condition conforms to the function value returns the Boolean false, can return a function the value, and jumps out this function; whenever you encounter a return statement, the program stops executing in that line of code, and execution control returns immediately to the code where the program is invoked. function

Copy Code code as follows:

function Chkinput (form)
{
if (form.title.value== "")
{
Alert ("Please enter the article title!");
Form.title.select ();
return false;
}

if (form.content.value== "")
{
Alert ("The article body cannot be empty @!!");
Form.content.select ();
return false;
}

return true;
}

2.form OnSubmit Property trigger question, when does the onsubmit event trigger? The onsubmit event occurs when the confirmation button in the form is clicked. The reasons for not triggering are generally as follows:

The timing of the OnSubmit property is triggered when the form is submitted with a button such as input:submit, otherwise it is not triggered. If you are using a normal Input:button, specify a JavaScript function in the OnClick property, and execute the form's submit () function in this function instead of the onsubmit attribute.

B. Read a piece of code first:

Copy Code code 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 logical judgments return false;
}
--></script>

Click submit button The form is not submitted. Because there is one place that should be changed to the following code:
<form action= "index.jsp" method= "POST" onsubmit= "return Submittest ();" > The original OnSubmit property is like a method name for <form> the HTML object whose value (a string) is its method body, and returns true by default;
As with Java, you can write as many statements as you want in the body of the method, including built-in functions and custom functions.
Here Submittest () returns false, but we only execute this function and do nothing with the result.
The onsubmit= "return Submittest" () uses its returned value to achieve the desired result. 3. The event handler function returns false and, in most cases, returns false for the event-handler function to prevent default event behavior.
For example, by clicking on a <a> element by default, the page jumps to the page specified by the href attribute of the element. Return False is the equivalent of a terminator, and return True is the equivalent of an operator. The function of return false in JS is generally used to cancel the default action. For example, you click a link to trigger a default event in addition to triggering your onclick time (if you specify) to perform a page jump. So if you want to cancel the default action on the object, you can return false. Return false applies more occasions: <body> 1, <a href= "/" mce_href= "/" onclick= ' Test (); ' > Hyperlink </a> 2, <input type= "button" onclick= ' Test () ' value= ' submitted "> 3, <form name=" Form1 "onsubmit=" return Test (); " > Content <input type= "Submit" value= "submitted" > </form> </body>
<input type= "Submit" onclick= "submitaction" (); return false; "The/> Submitaction method has the action to submit the form. If you do not add return false,
After the submitaction is executed, the Submit button will continue to perform its default event, and the form will be submitted again. This may be the root of many mistakes. Indeed, the meaning of return false is not to prevent the event from continuing to propagate to the top-level element, but to prevent the browser from default processing of events. You can test this: first of all the JS script annotation, in IE browser to try to drag the picture, you will find that the mouse will be prohibited to operate the style, the picture is prohibited to drag, it is the browser for the MouseMove event provided by the default behavior.
Return false is to remove this behavior, otherwise you will be describing the interruption of the execution of the event. In addition, the statement equivalent to return false is:
Window.event.returnValue = False,
You can replace the return false with this statement and verify it. Finally, this method only applies to IE browser.
The function of return false in JS is generally used to cancel the default action. For example, you click a link to trigger a default event in addition to triggering your onclick time (if you specify) to perform a page jump. So if you want to cancel the default action on the object, you can return false. Return false applies to a number of occasions:
<form name= "Form1" onsubmit= "return Youfunction ();" ... </form> <a href= "www.***.com" onclick= "...; return false; &GT;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.