http://jacki6.iteye.com/blog/477958
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void
void
Summary
The void operator evaluates the given expression and then returns undefined.
| Operator | |
| Implemented in: | JavaScript 1.1 |
| ECMA Version: | ECMA-262 |
Syntax
void expressionUses
This operator allows inserting expressions that produce side effects into places where an expression that evaluates to undefined is desired.
The void operator is often used merely to obtain the undefined primitive value, usually using "void(0)" (which is equivalent to "void 0"). In these cases, the global variable undefined can be used instead (assuming it has not been assigned to a non-default value).
JavaScript URIs
When a browser follows a javascript: URI, it evaluates the code in the URI and then replaces the contents of the page with the returned value, unless the returned value is undefined. The void operator can be used to return undefined. For example:
<a href="javascript:void(0);">Click here to do nothing</a> <a href="javascript:void(document.body.style.backgroundColor='green');">Click here for green background</a>
Note, however, that the javascript: pseudo protocol is discouraged over other alternatives, such as unobtrusive event handlers.
- <a href=”javaScript:void(0)” onClick=”doSomething();”>doSomething</a>
让我们先来看看JavaScript中void(0)的含义：
JavaScript中void是一个操作符，该操作符指定要计算一个表达式但是不返回值。
void 操作符用法格式如下：
- javascript:void (expression)
- javascript:void expression
expression是一个要计算的 JavaScript 标准的表达式。表达式外侧的圆括号是可选的，但是写上去是一个好习惯（类似于isinstanceof和typeof操作符）。我们可以使用 void 操作符指定超级链接。表达式会被计算但是不会在当前文档处装入任何内容。上面的代码创建了一个超级链接，当用户点击以后不会发生任何事。当用户点击链接时，void(0) 计算为 0，但在 JavaScript 上没有任何效果。
- <a href=”javascript:void(0)”>单击此处什么也不会发生</a>
也就是说，要执行某些处理，但是不需要任何页面刷新的情况下，可以使用void(0),但是在需要对页面进行refresh的情况下，那就要仔细了。
- <a href=”javascript:void(document.form.submit())”>
其实我们可以用上面的代码，这句话会进行一次submit操作。那什么情况下用void(0)比较多呢，无刷新，当然是Ajax了，看一下Ajax的web页面的话，一般都会看到有很多的void(0)，:D 所以在使用void(0)之前,最好先想一想,这个页面是否需要整体刷新。
=====================================
function func1()
{
return "http://www.baidu.com";
}
function myJsFunc()
{
alert("myJsFunc()");
}
<a onclick="fn()">Does not appear as a link, because there's no href</a>
<a href="javascript:void(0)"onclick="fn()">fn is called</a>
<a href="javascript:" onclick="fn()">fn is called too!</a>
It does not cause problems but it's a trick to do the same as PreventDefault
when you're way down in the page and an anchor as:
<a href="#" onclick="fn()">click here</a>you will jump to the top and the URL will have the anchor # as well, to avoid this we simply return false; or use javascript:void(0);
<a href="#" onclick="fn(); return false;">click here</a>
或者
<a href="javascript:void(0)" onclick="fn()">click here</a> <a href="http://www.baidu.com" onclick="return false;">test javascript99:</a> 页面不会跳转<a href='javascript: func1()'>test javascript:</a> 当前页面内容被替换成字符串"http://www.baidu.com", 不会进行跳转
<a href='javascript: “hello”'>test javascript2:</a> 当前页面内容被替换成字符串“hello”，不会进行跳转
<a href='javascript: void “hello”'>test javascript2:</a> 不替换，不跳转，因为void返回undefined
<a href='http://www.baidu.com'>test javascript3:</a> 当前页面跳转到百度
<a href="javascript:void(0)" onclick="myJsFunc();">test javascript4:</a> 没跳转，alert
<a href="javascript:" onclick="myJsFunc();">test javascript5:</a> 没跳转，alert
<a href="javascript:" onclick="func1();">test javascript6:</a> 没任何反应
<a href="javascript: func1();" onclick="myJsFunc();">test javascript7:</a> 先alert，然后页面内容被字符串“http://www.baidu.com”替换
<a href="http://www.baidu.com" onclick="myJsFunc();">test javascript8:</a> 先alert,然后页面跳转到百度
<a href="javascript:void(0);">Click here to do nothing</a>
<a href="javascript:void(document.body.style.backgroundColor='green');">Click here for green background</a>
<a href="javascript:(document.body.style.backgroundColor='green');">Click here ,content changed to string "green"</a>
<a href="#" onclick="myJsFunc();">test javascript99:</a> 页面跳到最顶端
<a href="#" onclick="myJsFunc();return false;">test javascript99:</a> 页面不会跳到最顶端，reture false 的作用： prevent default
<a href="javascript: myJsFunc();" onclick="return false;">test javascript10:</a> //因为returen false，prevent default，所以myJsFunc（）都不会执行
=================
Attribute Values
| Value | Description |
|---|---|
| URL | The URL of the link.
Possible values:
|
Having javascript: in any attribute that isn't specifically for scripting is an outdated method of HTML. While technically it works, you're still assigning javascript properties to a non-script attribute, which isn't good practice. It can even fail on old browsers, or even some modern ones (a googled forum post seemd to indicate that Opera does not like 'javascript:' urls).
A better practice would be the second way, to put your javascript into the onclick attribute, which is ignored if no scripting functionality is available. Place a valid URL in the href field (commonly '#') for fallback for those who do not have javascript.
If you must use the javascript: psuedo-protocol, you don't need the onclick attribute as well. <a href="javascript:myJsFunc();"> will do just fine.
I quite enjoy Matt Kruse's Javascript Best Practices article. In it, he states that using the href section to execute JavaScript code is a bad idea.
http://stackoverflow.com/questions/3666683/href-javascript-vs-href-javascriptvoid0
When using javascript: in navigation the return value of the executed script, if there is one, becomes the content of a new document which is displayed in the browser. The void operator in JavaScript causes the return value of the expression following it to return undefined, which prevents this action from happening. You can try it yourself, copy the following into the address bar and press return:
javascript:"hello"The result is a new page with only the word "hello". Now change it to:
javascript:void"hello"...nothing happens.
When you write javascript: on its own there's no script being executed, so the result of that script execution is also undefined, so the browser does nothing. This makes the following more or less equivalent:
javascript:undefined;
javascript:void0;
javascript:With the exception that undefined can be overridden by declaring a variable with the same name. Use of void 0 is generally pointless, and it's basically been whittled down from void functionThatReturnsSomething().
As others have mentioned, it's better still to use return false; in the click handler than use the javascript: protocol.
Of course, if you're using javascript: in the link, return false would prevent that script from being executed anyway, so in that sense it would be useless
<a href="javascript: myJsFunc();" onclick="return false;">test javascript10:</a>
The return value of an event handler determines whether or not the default browser behaviour should take place as well.
浙公网安备 33010602011771号