遇到过几次这种问题,现在总结一下。

代码:

<a onclick="window.location.href='http://www.google.com'" href="javascript:void(0);">google</a>
这段代码在主流的浏览器里面都没问题,但是在IE6下就会出现不能跳转的现象。

经过一翻排查,发现绑定的事件都会执行,是由于DOM本身的冒泡事件所以会最后执行href属性内的javascript:void(0);导致的。

a标签

a标签本来就是用来进行页面跳转的标签,其运行机制是告诉浏览器URL地址并且跳转。当然,我们可以在href属中直接执行javascript。

代码:

<a href="javascript:alert('Hello!');">Say Hello</a>
Say Hello

这里由于javascript执行了alert函数,但是其返回的是null。所以a标签没有执行任何动作。

javascript:void(0);

void(arg);可以理解为永远返回null的函数,但是其参数不能为空。其参数可以为任意的表达式甚至是函数。

代码:

<a href="javascript:void(name = 'will'); alert('Hello ' + name);">Say Hello</a>
Say Hello

对IE6运行的猜想

IE6会先运行DOM本身绑定的事件,如onclick;如果没有阻止冒泡,则会顺序执行href属性。而void(0);正是不需要执行任何事件,则IE6告诉浏览器不执行任何事件(覆盖之前的动作),并且终止冒泡相当于return false;于是浏览器没有执行任何动作。

这样只要在onclick事件内阻止冒泡事件即可。

经过改进的代码为:

<a onclick="window.location.href='http://www.google.com' return false;" href="javascript:void(0);">google</a>
这样在IE6下就可以正常运行了。

其他方法

当然可以不使用javascript:void(0);而改使用#也可以避免,href属性内的#本来的意思就是锚点#name所以当不指定任何锚时自然会到页面顶端并在URL后加入Hash symbol。

这里对于锚还有一个比较特殊的用法

当href属性的值是锚点时,但是又找不到该锚点,则相当于返回null,所以可以使用##来代替javascript:void(0);

当然前提是你的页面不要有锚点的名字是#的哟~

 
### 和## 有什么区别?
按href属性的#解释,##应该是去寻找<a name='#'></a>的锚点,###应该是去寻找<a name='##'></a>的锚点,但是name属性应该是以[A-Za-z]字母开头并且具有唯一性的标识。所以这应该仅仅只是一种hack写法,应该没什么区别。以上是我的理解 :)

ie6 javascript:void(0);的更多相关文章

  1. IE6与 javascript:void(0)

    遇到过几次这种问题,现在总结一下. 代码: <a onclick="window.location.href='http://www.google.com'" href=&q ...

  2. IE6下javascript:void(0)不可用的解决

    <a href="javascript:void(0)" class="inp_sear_a" onclick="doSubmit();&quo ...

  3. a href=#与 a href=javascript:void(0) 的区别

    a href="#"> 点击链接后,页面会向上滚到页首,# 默认锚点为 #TOP <a href="javascript:void(0)" onCl ...

  4. href使用 javascript:;与javascript:void(0)防跳到顶部

    有时候我们在编写js过程中,需要触发事件而不需要返回值,那么就可能需要这样的写法   href=”#”,包含了一个位置信息.默认的锚是#top,也就是网页的上端,当连续快速点击此链接时会导致浏览器巨慢 ...

  5. a标签的href="javascript:void(0)"和href="#"的区别

    修正一个说法上的bug吧.对于IE6来说,点击后gif暂停bug仅仅发生在“javascript:伪协议未加分号”的情形下. 我再来提供一个视角吧. 给<a>标签增加href属性,就意味着 ...

  6. a href=#与 a href=javascript:void(0) 的差别

    a href="#"> 点击链接后,页面会向上滚到页首,# 默认锚点为 #TOP <a href="javascript:void(0)" onCl ...

  7. a标签中的href="#"与href="javascript:void(0)"区别

    转自http://blog.csdn.net/fightplane/article/details/5190037 <a href="#"> 点击链接后,页面会向上滚到 ...

  8. a href=#与 a href=javascript:void(0) 的区别(转)

    a href="#"> 点击链接后,页面会向上滚到页首,# 默认锚点为 #TOP <a href="javascript:void(0)" onCl ...

  9. 【repost】javascript:;与javascript:void(0)使用介绍

    有时候我们在编写js过程中,需要触发事件而不需要返回值,那么就可能需要这样的写法 最近看了好几个关于<a>标签和javascript:void(0)的帖子,谨记于此,以资查阅. 注:以下代 ...

随机推荐

  1. php curl 抓取

    <?php set_time_limit(0); function curl_multi($urls) { if (!is_array($urls) or count($urls) == 0) ...

  2. MOSFET pair makes simple SPDT switch

    With an n- and p-channel MOSFET, you can easily implement a single-pole double-throw (SPDT) switch t ...

  3. java socket 长连接 短连接

    长连接 是一旦一个客户端登陆上服务器,其与服务器之间的连接就不关闭,不管他们之间进行了多少次交易,直到客户端退出登陆或网络出现故障.这种技术在联机交易系统实现有利于提高效率. 短连接是客户端每发一个请 ...

  4. linux查看文件有多少行(WC)

    使用wc命令 具体通过wc --help 可以查看. 如:wc -l filename 就是查看文件里有多少行 wc -w filename 看文件里有多少个word. wc -L filename ...

  5. 用 Redis 实现分布式锁(分析)

    文章转自:http://www.jeffkit.info/2011/07/1000/ Redis有一系列的命令,特点是以NX结尾,NX是Not eXists的缩写,如SETNX命令就应该理解为:SET ...

  6. ICLR 2013 International Conference on Learning Representations深度学习论文papers

    ICLR 2013 International Conference on Learning Representations May 02 - 04, 2013, Scottsdale, Arizon ...

  7. HTML学习要点

    目标 掌握HTML基本语法,了解HTML Document结构,能熟练使用HTML Element对象. 要点 基本概念:什么是HTML.HTML标签? 熟悉常用的HTML标签含义以及应用场合. ht ...

  8. Android -- 写xml到SD卡中

    信息类                                                                                          private ...

  9. JVisualVM简介与内存泄漏实战分析

    JVisualVM简介与内存泄漏实战分析 学习了:https://blog.csdn.net/kl28978113/article/details/53817827

  10. 使用ReportStudio打开cube模型创建报表出现两个最细粒度名称

    本人也是第一次遇到这样的问题,此问题甚是简单,也许很简短的一句话就可以解决这个问题了,看官请留神哦 cube做好发布到cognos之后使用Analysis Studio打开结构正常 于是想到要用此数据 ...