妙用javascript:void(0)

在开发过程中经常使用<a href="#"/>，可是在点击这个链接的时候，总是跳到页面的顶端，如果滚动条很长的话，并且已经阅览的页面底部的时候，给用户带来很大的困扰。

为什么会出现这种情况呢，查阅资料发现，#代表一个锚点，并且这个锚点是在页面的顶部，所以每次点击这个链接都会跳到页面顶部。

如果我们不想让页面跳动的话可以使用javascript:void(0)代替#，页面就不会发生跳动了。增强了用户的体验度。

评论

21 楼 Shrek82 2010-01-20  

有个很重要的地方，表现不同：

1、<a href="#" onclick="alert()">click me</a>
2、<a href="javascript:void(0)" onclick="alert()"></a>

第1个，在IE6（IE8没有哪个地球了）下点击链接，弹出对话框没有按确定的时候，你就会发现IE工具栏上面的那个小地球在旋转，说明IE还在发送一个请求。。。

第2个，在IE6下，发现地球是静止不动的，仅仅是执行一个本地的动作。

很久之前的测试了，大家可以测试下。

20 楼 aninfeel 2010-01-20  

一般都用#加return false，javascript:void(0)写起来太麻烦了

19 楼 lifesinger 2010-01-20  

曾经总结过：

链接A引发的思考：http://lifesinger.org/blog/2008/12/think-about-link-a/

18 楼 happysoul 2010-01-20  

一定要用到A标签么？
使用样式 cursor:pointer;
即使是一个div
<div style="cursor:pointer;">111</div>
也是可以实现鼠标放上去变成一只手
进阶
<style>
.hover{font-width:blod;}
</style>
<div style="cursor:pointer;" onmouseover="this.className='hover'" onmouseout="this.class=''">111</div>

我们的目的只是为了让a用起来像个Button而已

17 楼 yhailj 2010-01-18  

为了保证不与 onclick 中定义的 javascript 冲突.
建议不使用 href="javascritp:;" 通常都是使用 href="###" . 页面也不会动

16 楼 eplang 2010-01-18  

hq2300 写道

我觉得用javascript:void(0)没任何意义，如果是要代替<a href='#'></a>,不如直接写<a></a>,既然用不上链接地址，又何须加href,如果碰到页面里设置了<base target="_blank" />，有href的空链接一样会起作用。

<a></a>这种方式压根没有链接效果.
没有href属性的话就只是显示标签里面的文本.

15 楼 hq2300 2010-01-18  

我觉得用javascript:void(0)没任何意义，如果是要代替<a href='#'></a>,不如直接写<a></a>,既然用不上链接地址，又何须加href,如果碰到页面里设置了<base target="_blank" />，有href的空链接一样会起作用。

14 楼 soni 2010-01-18  

js能省就省了。

13 楼 sunhj000java 2010-01-18  

MrLee23 写道

<a href="#" onclick="a();return false;">什么问题都解决了,包括浏览器不兼容问题</a>

但是我就没办法不是要麻烦一点的嘛，

12 楼 MrLee23 2010-01-18  

<a href="#" onclick="a();return false;">什么问题都解决了,包括浏览器不兼容问题</a>

11 楼 coca 2010-01-17  

也可以用:javascript:undefind;

10 楼 black.angel 2010-01-17  

wiwiluo 写道

写成这样也是可以的
javascript:;

我一直都用这个写法.

9 楼 snowing11812 2010-01-17  

我一般都用下面几种:
1.href="javascript:void(0);"
2.href="javascript:;"
3.href="#all"
4.href="####"

目前最多用第2种，只是目前还没有详细研究区别，只是为了实现“点击后不要什么反应”的目的

8 楼 bazhuang 2010-01-17  

关于这个问题，我专门写了一篇博客，感兴趣的可以看看，会有更好的方案
http://bazhuang.iteye.com/blog/548381

7 楼 rjzou2006 2010-01-16  

用三个#
或者四个#

都行。

6 楼 wiwiluo 2010-01-16  

写成这样也是可以的
javascript:;

5 楼 鹤惊昆仑 2010-01-16  

href="javascript:void(0);" 事实上void可以里面可以是任意值（表达式、函数等），但如果不幸写成href="javascript:void();"，在IE下面就报错了；可恶的是如果不知道这个错误，它还很难跟踪定位，容易糊弄人。

4 楼 sunhj000java 2010-01-16  

coofucoo 写道

sunhj000java 写道

如果我们不想让页面跳动的话可以使用javascript:void(0)代替#，页面就不会发生跳动了。增强了用户的体验度。

会不会对搜索引擎不友好？

应该不会吧，它起到的是一个锚点的作用撒

3 楼 sunhj000java 2010-01-16  

fnet 写道

sunhj000java 写道

在开发过程中经常使用<a href="#"/>，可是在点击这个链接的时候，总是跳到页面的顶端，如果滚动条很长的话，并且已经阅览的页面底部的时候，给用户带来很大的困扰。

为什么会出现这种情况呢，查阅资料发现，#代表一个锚点，并且这个锚点是在页面的顶部，所以每次点击这个链接都会跳到页面顶部。

如果我们不想让页面跳动的话可以使用javascript:void(0)代替#，页面就不会发生跳动了。增强了用户的体验度。

# 也可以，你只需要 onclick="return false" 即可。
javascript:void(0) 在有的浏览器会有问题。

浏览器问题还没有测试过呢，我是要用onclick事件的，是href=javascript:void(0)

2 楼 coofucoo 2010-01-16  

sunhj000java 写道

如果我们不想让页面跳动的话可以使用javascript:void(0)代替#，页面就不会发生跳动了。增强了用户的体验度。

会不会对搜索引擎不友好？