What does the "return" do in "return MyFunction()"

Question

On the Moz Dev Network, it give an example of using onchanged like this:

<textbox id="find-text" onchange="return myFunction(event);"/>

What is the difference between the above and the below which does not use "return"?

<textbox id="find-text" onchange="myFunction(event);"/>

Here is a complete example:

<input onchange="return checkChanged()" type="checkbox" />
<script>
    function checkChanged() {
        alert("checkChanged");
        return false;
    }
</script>

Whether I use the "return" or not, the value always changes after being clicked. I would think that since it returns false, then it would not let the user check the box.

EDIT:The actual answer in this example is "Nothing." However, this is because onchange is not cancelable. Other events, such as onclick ARE cancelable, and returning false prevents the default action, such as preventing the click from taking effect (ie, the check would not change.)

score 2 · Accepted Answer · answered Jan 31 '14 at 12:44

2

This will return result of your myFunction() invoking. In your case if this will return Boolean value this will change or not <textarea> content.

Read more about Function's at MDN and onchange element property.

answered Jan 31 '14 at 12:44

antyrat

27,479
9
75
76

Thanks, i wasn't sure myself why sometimes you return a value from an event handler. :) – Scimonster Jan 31 '14 at 12:46
When I try the example, it DOES change the state, even though I return false. – Greg Gum Jan 31 '14 at 12:58
I was talking why this is working in Event's. So in checkbox case you should use `onclick` then it will be not clicked. On `textarea` `onkeypress` for example. See jsFiddle http://jsfiddle.net/w56S2/ – antyrat Jan 31 '14 at 13:02
OK, yes, I got it now. Thanks for the jsFiddle. – Greg Gum Jan 31 '14 at 13:04

score 0 · Answer 2 · answered Jan 31 '14 at 12:48

When you return something from a function, that value gets returned to the caller. For instance, say I had a method to multiply two numbers. Maybe the code looks like this:

function multiply(num1, num2) {
return num1 * num2;
}
result = multiply(2, 4);

The function multiply will return the result of it's multiplication to wherever it was called. The right-hand side of the result assignment is where the function is called, so that is where the result is returned to. So, in this case (with the parameters 2 and 4), it is the same as writing result = 8;

When you are using return true or false with markup, you are indicating whether or not you want the default action to happen after the javascript has been executed.

Yagnesh Agola · Answer 3 · 2014-01-31T12:59:21.027

From this Reference Link

Sets or retrieves a Boolean value that indicates whether the current event is canceled.When an event is canceled, the default action that belongs to the event will not be executed. For example, when the onclick event (the onclick event is cancelable) is canceled for a checkbox, then clicking on the checkbox does not change its checked state.

Use of return value is to prevent default event handler to execute based on the Boolean return value.Not every event can be canceled. You can use return when you when you want that on some condition you want to prevent default event execution.
For example : onclick event of submit button of form if you return false it will prevent form to submit and if you return true it will continue submit from.

What does the "return" do in "return MyFunction()"

3 Answers3

Linked