javascript:void(0);用法及常见问题解析
使用过ajax的朋友经常会见到这样的代码:here,这里面的void是一个操作符,该操作符指定要计算一个表达式但是不返回值。javascript:void(0) 在某些情况下会有浏览器不兼容的bug。下面我们先来看下javascript:void(0) 的基础介绍及用法,然后再来看使用它会出现什么问题,该怎么解决。
提示:在学习一下内容之前,你可以先通过javascript:void(0) 含义一节的内容来了解或者复习什么是javascript:void(0) !
void 操作符用法格式如下:
1. javascript:void (expression)
2. javascript:void expression
expression 是一个要计算的 Javascript 标准的表达式。表达式外侧的圆括号是选的,但是写上去是一个好习惯。 (实现版本 Navigator 3.0)
你可以使用 void 操作符指定超级链接。表达式会被计算但是不会当前文档处装入任何内容。
下面的代码创建了一个超级链接,当用户以后不会发生任何事。当用户链接时,void(0) 计算为 0,但 Javascript 上没有任何效果。
<a herf="javascript:void(0)">点击此处什么也不会发生</a>
下面的代码创建了一个超级链接,用户单时会提交表单。
<a href="javascript:void(document.form.submit())">
单此处提交表单</a>
下面代码则执行了subgo()函数,
<a href="javascript:void(0)"onclick="subgo()">点我</a>
在这里,javascript:void(0),没启实质上的作用,它仅仅是一个死链接,执行的函数是subgo()。
<a href="#" onclick="subgo()">点我</a>与<ahref="javascript:void(0)" onclick="subgo()">点我</a>区别。
<a href="javascript:void(0)"onclick="javascript:history.back();">返回 </a>
href=”#”,包含了一个位置信息.默认的锚是#top,也就是网页的上端,当连续快速点击此链接时会导致浏览器巨慢甚至崩溃。而javascript:void(0) 仅仅表示一个死链接,没有任何信息。所以调用脚本的时候最好用void(0)
其实我们可以这样用,这句话会进行一次submit操作。那什么情况下用void(0)比较多呢,无刷新,当然是Ajax了,看一下Ajax的web页面的话,一般都会看到有很多的void(0),所以在使用void(0)之前,最好先想一想,这个页面是否需要整体刷新。
说白了,href="#"这种形式会整体刷新页面,而href="javascript:void(0)" 则不会。所以如果是空连接的话,还是推荐javascript:void(0)。
<a href="javascript:void(0);" >test</a>
<a href="javascript:;" >test</a>
<a href="####" >test</a> //使用2个到4个#,见的大多是"####",也有使用"#all"等其他的
<a href="javascript:void(0)" onclick="doSomething()">test</a>
<a href="#" onclick="doSomething();return false;">什么问题都解决了,包括浏览器不兼容问题</a> //或者直接使用href=""
<a href="#" onclick="alert();event.returnValue=false;">test</a>
<a href=”void(0);” rel=”nofollow”>
Click here to do nothing
</a>
<a href=”void(document.body.style.backgroundColor=’green’);” rel=”nofollow”>
Click here for green background
</a>
有可能是 javascript:void(0); 既保证了返回值是undefined,又保证如果连接点击需要处理一些代码,随时将0替换掉就可以。解决IE下使用javascript:void(0)方法会跳转的方法
<a href="javascript:void(0)" title="关闭" onclick="delbook();">关闭</a>
或者:<a href="javascript:;" title="关闭" onclick="delbook();">关闭</a>
以上两种方法都可能会出现跳转。
但是你会发现:在执行完clidk事件后会执行javascript:void(0),或者javascript:;
<a href="javascript:void(0)" title="关闭" onclick="delbook();return false;">关闭</a>
或者<a href="javascript:void(0)" target="_self" title="关闭" onclick="delbook();">关闭</a>
使用return false;可以阻止javascript:void(0)去执行。
使用target="_self"可以阻止会跳转到其他页面,因其是空函数,则不会发生页面刷新。
当然,在使用target="_self"的情况下,你可以直接这样写。
<a href="javascript:delbook()" target="_self" title="关闭">关闭</a>
只要是页面中有刷新或者跳转动作就要用上面的解决方法。JS的几种跳转方式:
1.
window.open(”url“)
2.用自定义函数
<script>
function openWin(tag,obj) {
obj.target="_blank";
obj.href = "Web/Substation/Substation.aspx?stationno="+tag;
obj.click();
}
</script>
<a href="javascript:void(0)"onclick="openWin(3,this)">点我</a>
3.window.location.href='';