blocks|key|1743767|text|我相信它会导致标准事件不会发生。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1743768|在您的示例中，浏览器不会尝试转到#。|1743769|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

I believe it causes the standard event to not happen.

In your example the browser will not attempt to go to #.

blocks|key|1528777|text|从JavaScript事件返回false通常会取消“默认”行为-在链接的情况下，它会告诉浏览器不要访问该链接。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1528778|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Retuning false from a JavaScript event usually cancels the "default" behavior - in the case of links, it tells the browser to not follow the link.

blocks|key|1528820|text|Return+false将阻止导航。否则，该位置将成为someFunc的返回值|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1528821|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Return false will prevent navigation. Otherwise, the location would become the return value of someFunc

blocks|key|1743866|text|返回false表示不执行默认操作，在<a+href>的情况下，默认操作是跟随链接。当您向onclick返回false时，href将被忽略。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1743867|entityMap^0|I|8|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

The return false is saying not to take the default action, which in the case of an <code>&lt;a href&gt;</code> is to follow the link. When you return false to the onclick, then the href will be ignored.

blocks|key|1743931|text|在onclick事件中使用return+false会阻止浏览器处理执行堆栈的其余部分，包括href属性中的链接。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1743932|换句话说，添加return+false会停止href的工作。在您的示例中，这正是您想要的。|1743933|在按钮中，这是不必要的，因为onclick是它要执行的全部--没有href可供处理和转到。|1743934|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|H|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|I|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|J|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|G|$]]

using return false in an onclick event stops the browser from processing the rest of the execution stack, which includes following the link in the href attribute.

In other words, adding return false stops the href from working. In your example, this is exactly what you want.

In buttons, it's not necessary because onclick is all it will ever execute -- there is no href to process and go to.

blocks|key|1528946|text|浏览器黑客：http://jszen.blogspot.com/2007/03/return-false-to-prevent-jumping.html|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1528947|entityMap|0|LINK|mutability|MUTABLE|url|http://jszen.blogspot.com/2007/03/return-false-to-prevent-jumping.html^0|6|1Y|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

Browser hack:
<a href="http://jszen.blogspot.com/2007/03/return-false-to-prevent-jumping.html" rel="noreferrer">http://jszen.blogspot.com/2007/03/return-false-to-prevent-jumping.html</a>

blocks|key|1529005|text|Return+false将在javascript运行后停止正在跟踪的超链接。这对于不显眼的javascript来说很有用，它会优雅地降级-例如，你可以有一个缩略图图像，它使用javascript打开全尺寸图像的弹出窗口。当javascript被关闭或者用鼠标中键点击图像(在新标签中打开)时，这会忽略onClick事件，正常情况下只会将图像作为全尺寸图像打开。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1529006|如果未指定return+false，映像将启动弹出窗口并正常打开映像。有些人不使用return+false，而是使用javascript作为href属性，但这意味着当javascript被禁用时，链接将不会执行任何操作。|1529007|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

Return false will stop the hyperlink being followed after the javascript has run. This is useful for unobtrusive javascript that degrades gracefully - for example, you could have a thumbnail image that uses javascript to open a pop-up of the full-sized image. When javascript is turned off or the image is middle-clicked (opened in a new tab) this ignores the onClick event and just opens the image as a full-sized image normally.

If return false were not specified, the image would both launch the pop-up and open the image normally. Some people instead of using return false use javascript as the href attribute, but this means that when javascript is disabled the link will do nothing.

blocks|key|1744079|text|事件处理程序的返回值确定是否也应该发生默认浏览器行为。在单击链接的情况下，这将跟随链接，但在表单提交处理程序中差异最明显，在表单提交处理程序中，如果用户输入了错误的信息，则可以取消表单提交。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1744080|我不相信有这样的W3C规范。所有像这样的古老的JavaScript接口都被赋予了"DOM+0“的昵称，并且大多数都是未指定的。你可能会有一些运气阅读旧的Netscape+2文档。|1744081|实现此效果的现代方法是调用event.preventDefault()，这是在the+DOM+2+Events+specification中指定的。|offset|length|style|CODE|1744082|entityMap|0|LINK|mutability|MUTABLE|url|http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-cancelation^0|0|0|D|M|13|U|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|T|8|@$F|U|G|V|H|I]]|9|@$F|W|G|X|1|Y]]|A|$]]|$1|J|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|K|$L|$5|M|N|O|A|$P|Q]]]]

The return value of an event handler determines whether or not the default browser behaviour should take place as well. In the case of clicking on links, this would be following the link, but the difference is most noticeable in form submit handlers, where you can cancel a form submission if the user has made a mistake entering the information.

I don't believe there is a W3C specification for this. All the ancient JavaScript interfaces like this have been given the nickname "DOM 0", and are mostly unspecified. You may have some luck reading old Netscape 2 documentation.

The modern way of achieving this effect is to call <code>event.preventDefault()</code>, and this is specified in <a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-cancelation" rel="noreferrer">the DOM 2 Events specification</a>.

blocks|key|1529101|text|这里有一个更健壮的例程来取消所有浏览器中的默认行为和事件冒泡：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1529102|//+Prevents+event+bubble+up+or+any+usage+after+this+is+called.
eventCancel+=+function+(e)
{
++++if+(!e)
++++++++if+(window.event)+e+=+window.event;
++++++++else+return;
++++if+(e.cancelBubble+!=+null)+e.cancelBubble+=+true;
++++if+(e.stopPropagation)+e.stopPropagation();
++++if+(e.preventDefault)+e.preventDefault();
++++if+(window.event)+e.returnValue+=+false;
++++if+(e.cancel+!=+null)+e.cancel+=+true;
}|code-block|syntax|javascript|1529103|下面是一个如何在事件处理程序中使用它的示例：|1529104|//+Handles+the+click+event+for+each+tab
Tabstrip.tabstripLinkElement_click+=+function+(evt,+context)+
{
++++//+Find+the+tabStrip+element+(we+know+it's+the+parent+element+of+this+link)
++++var+tabstripElement+=+this.parentNode;
++++Tabstrip.showTabByLink(tabstripElement,+this);
++++return+eventCancel(evt);
}|1529105|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Here's a more robust routine to cancel default behavior and event bubbling in all browsers:
<pre><code>// Prevents event bubble up or any usage after this is called.
eventCancel = function (e)
{
 if (!e)
 if (window.event) e = window.event;
 else return;
 if (e.cancelBubble != null) e.cancelBubble = true;
 if (e.stopPropagation) e.stopPropagation();
 if (e.preventDefault) e.preventDefault();
 if (window.event) e.returnValue = false;
 if (e.cancel != null) e.cancel = true;
}
</code></pre>
An example of how this would be used in an event handler:
<pre><code>// Handles the click event for each tab
Tabstrip.tabstripLinkElement_click = function (evt, context) 
{
 // Find the tabStrip element (we know it's the parent element of this link)
 var tabstripElement = this.parentNode;
 Tabstrip.showTabByLink(tabstripElement, this);
 return eventCancel(evt);
}
</code></pre>

blocks|key|1744144|text|您可以从以下示例中看到不同之处：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1744145|<a+href="http://www.google.co.uk/"+onclick="return+(confirm('Follow+this+link?'))">Google</a>|code-block|syntax|javascript|1744146|单击“is”返回true，并跟随链接。单击"Cancel“将返回false，并且不会跟随该链接。如果javascript被禁用，该链接将被正常跟踪。|1744147|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

You can see the difference with the following example:

<pre><code>&lt;a href="http://www.google.co.uk/" onclick="return (confirm('Follow this link?'))"&gt;Google&lt;/a&gt;
</code></pre>

Clicking "Okay" returns true, and the link is followed. Clicking "Cancel" returns false and doesn't follow the link. If javascript is disabled the link is followed normally.

blocks|key|1529206|text|令我惊讶的是，没有人提到onmousedown而不是onclick。这个|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1529207|onclick='return+false'|1529208|不会捕获浏览器的默认行为，这会导致mousedown发生(有时不需要的)文本选择，但是|1529209|onmousedown='return+false'|1529210|确实如此。|1529211|换句话说，当我点击一个按钮时，它的文本有时会意外地被选中，改变了按钮的外观，这可能是不必要的。这是我们在这里试图防止的默认行为。但是，mousedown事件是在click之前注册的，因此如果您只在click处理程序中阻止该行为，它将不会影响mousedown事件产生的不需要的选择。因此，文本仍会被选中。但是，阻止mousedown事件的默认值将会起到作用。|1529212|另请参阅event.preventDefault()+vs.+return+false|1529213|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false^0|C|B|Q|7|0|0|M|0|H|9|0|0|Q|0|0|1V|9|28|5|2Q|5|3C|9|4D|9|0|4|13|0|0^^$0|@$1|2|3|4|5|6|7|Z|8|@$9|10|A|11|B|C]|$9|12|A|13|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|14|8|@$9|15|A|16|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|17|8|@$9|18|A|19|B|C]]|D|@]|E|$]]|$1|J|3|K|5|6|7|1A|8|@$9|1B|A|1C|B|C]]|D|@]|E|$]]|$1|L|3|M|5|6|7|1D|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|1E|8|@$9|1F|A|1G|B|C]|$9|1H|A|1I|B|C]|$9|1J|A|1K|B|C]|$9|1L|A|1M|B|C]|$9|1N|A|1O|B|C]]|D|@]|E|$]]|$1|P|3|Q|5|6|7|1P|8|@]|D|@$9|1Q|A|1R|1|1S]]|E|$]]|$1|R|3|-4|5|6|7|1T|8|@]|D|@]|E|$]]]|S|$T|$5|U|V|W|E|$X|Y]]]]

I am surprised that no one mentioned <code>onmousedown</code> instead of <code>onclick</code>. The 

<code>onclick='return false'</code> 

does not catch the browser's default behaviour resulting in (sometimes unwanted) text selection occurring for <code>mousedown</code> but 

<code>onmousedown='return false'</code> 

does.

In other words, when I click on a button, its text sometimes becomes accidentally selected changing the look of the button, that may be unwanted. That is the default behaviour that we are trying to prevent here. However, the <code>mousedown</code> event is registered before <code>click</code>, so if you only prevent that behaviour inside your <code>click</code> handler, it will not affect the unwanted selection arising from the <code>mousedown</code> event. So the text still gets selected. However, preventing default for the <code>mousedown</code> event will do the job.

See also <a href="https://stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false">event.preventDefault() vs. return false</a>

blocks|key|1744271|text|return+false可防止页面被导航以及不必要地将窗口滚动到顶部或底部。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1744272|onclick="return+false"|code-block|syntax|javascript|1744273|entityMap^0|0|C|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

The <code>return false</code> prevents the page from being navigated and unwanted scrolling of a window to the top or bottom.

<pre><code>onclick="return false"
</code></pre>

blocks|key|1529344|text|我的HTML页面上有这个链接：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1529345|<a+href+=+""+
onclick+=+"setBodyHtml+('new+content');+return+false;+"
>+click+here+</a>|code-block|syntax|javascript|1529346|函数setBodyHtml()定义为：|1529347|function+setBodyHtml+(s)
{+document.body.innerHTML+=+s;
}|1529348|当我单击该链接时，该链接将消失，浏览器中显示的文本将更改为"new+content“。|1529349|但是如果我从我的链接中去掉了"false“，那么点击这个链接似乎什么也不会做。为什么会这样呢？|1529350|这是因为如果我没有返回false，那么单击链接并显示其目标页面的默认行为就不会被取消。但是，在这里，超链接的href是"“，所以它链接回相同的当前页面。因此，页面实际上只是刷新了一下，似乎什么也没发生。|1529351|在后台，函数setBodyHtml()仍然会被执行。它将其参数赋值给body.innerHTML。但是因为页面是立即刷新/重新加载的，所以修改后的正文内容可能不会在几毫秒内保持可见，所以我不会看到它。|1529352|这个例子说明了为什么有时使用"return+false“很有用。|1529353|我确实想给链接分配一些href，这样它就会显示为一个链接，作为带下划线的文本。但我不希望点击链接就能有效地重新加载页面。我希望取消默认的navigation=behavior，以及调用我的函数所引起的任何副作用，使其生效并保持有效。因此，我必须“返回false”。|1529354|上面的例子是你可以在开发过程中快速尝试的东西。对于生产环境，您更有可能在JavaScript中分配一个单击处理程序并调用preventDefault()。但是为了快速试用一下，上面的"return+false“就行了。|1529355|entityMap^0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|12|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|13|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|14|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|15|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|16|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|17|8|@]|9|@]|A|$]]|$1|S|3|T|5|6|7|18|8|@]|9|@]|A|$]]|$1|U|3|V|5|6|7|19|8|@]|9|@]|A|$]]|$1|W|3|X|5|6|7|1A|8|@]|9|@]|A|$]]|$1|Y|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]]|Z|$]]

I have this link on my HTML-page:

<pre><code>&lt;a href = "" 
onclick = "setBodyHtml ('new content'); return false; "
&gt; click here &lt;/a&gt;
</code></pre>

The function setBodyHtml() is defined as:

<pre><code>function setBodyHtml (s)
{ document.body.innerHTML = s;
}
</code></pre>

When I click the link the link disappears and the text shown in the browser
changes to "new content".

But if I remove the "false" from my link, clicking the link does (seemingly) nothing. Why is that?

It is because if I don't return false the default behavior of clicking the link and displaying its target-page happens, is not canceled. BUT, here the href of the hyperlink is "" so it links back to the SAME current page. So the page is effectively just refreshed and seemingly nothing happens. 

In the background the function setBodyHtml() still does get executed. It assigns its argument to body.innerHTML. But because the page is immediately refreshed/reloaded the modified body-content does not stay visible for more than a few milliseconds perhaps, so I will not see it.

This example shows why it is sometimes USEFUL to use "return false". 

I do want to assign SOME href to the link, so that it shows as a link, as underlined text. But I don't want the click to the link to effectively just reload the page. I want that default navigation=behavior to be canceled and whatever side-effects are caused by calling my function to take and stay in effect. Therefore I must "return false".

The example above is something you would quickly try out during development. For production you would more likely assign a click-handler in JavaScript and call preventDefault() instead. But for a quick try-it-out the "return false" above does the trick.

blocks|key|1529400|text|当使用表单时，我们可以使用'return+false‘来阻止提交。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1529401|function+checkForm()+{
++++//+return+true+to+submit,+return+false+to+prevent+submitting
}
<form+onsubmit="return+checkForm()">
++++...
</form>|code-block|syntax|javascript|1529402|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

When using forms，we can use 'return false' to prevent submitting.

<pre><code>function checkForm() {
 // return true to submit, return false to prevent submitting
}
&lt;form onsubmit="return checkForm()"&gt;
 ...
&lt;/form&gt;
</code></pre>

blocks|key|1744419|text|默认情况下，当你点击按钮时，无论你输入了什么值，表单都会被发送到服务器。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1744420|但是，这种行为不太适合大多数情况，因为我们可能希望在将其发送到服务器之前进行一些检查。|1744421|因此，当监听器收到"false“时，提交将被取消。基本上，它的目的是在前端做一些检查。|1744422|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|H|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|I|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|J|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|G|$]]

By default, when you click on the button, the form would be sent to server no matter what value you have input.
However, this behavior is not quite appropriate for most cases because we may want to do some checking before sending it to server.
So, when the listener received &quot;false&quot;, the submitting would be cancelled. Basically, it is for the purpose to do some checking on front end.

Many times I've seen links like these in HTML pages:

<pre><code>&lt;a href='#' onclick='someFunc(3.1415926); return false;'&gt;Click here !&lt;/a&gt;
</code></pre>

What's the effect of the <code>return false</code> in there?

Also, I don't usually see that in buttons.

Is this specified anywhere? In some spec in w3.org?

What's the effect of adding 'return false' to a click event listener?

服务器

我在HTML页面中多次看到这样的链接：<a href='#' onclick='someFunc(3.1415926); return false;'>Click here !</a>里面的return false有什么作用呢？而且，我通常不会在按钮中看到这一点。这是在任何地方指定的吗？在w3.org中的某个规范中？

问将'return false‘添加到单击事件侦听器中会有什么效果？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将'return false‘添加到单击事件侦听器中会有什么效果？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将'return false‘添加到单击事件侦听器中会有什么效果？
EN