今天在开发中发现，使用如下方式的链接。在Chrome中点击后行为符合预期，但在IE下会新开标签卡（根据参考资料，Firefox中有相同问题）。

经过排查，发现是href="javascript:void(0);"导致的问题，本来javascript:void(0);的用处是不用整体刷新网页且返回一个空值，但这儿由于DOM本身的冒泡事件所以会最后执行HREF属性内的javascript:void(0);导致执行函数返回了一个空值，所以覆盖掉了前面正常执行函数所返回的值引起的错误。

一般情况下，IE会先运行DOM本身绑定的事件，如ONCLICK;如果没有阻止冒泡，则会顺序执行HREF属性。如果想正确运行，可以在前面用RETURN FALSE终止冒泡，例如：

<a target="_blank" class="prev"  onclick="return false;"   href="javascript:void(0);"></a>

或者直接删去也行，如：
<a target="_blank"  class="prev" ></a>

原因在于三款浏览器，对三个属性的处理顺序不同。

Chrome顺序：onclick -> href -> target
IE和Firefox顺序：onclick -> target -> href

关于火狐和IE下href="javascript:void(0)"兼容性的问题的更多相关文章

  1. a标签使用href=”javascript:void(0); 在火狐浏览器跟chrome 不兼容

    使用如下方式的链接.在Chrome中点击后行为符合预期,但在IE下会新开标签卡(根据参考资料,Firefox中有相同问题).<a href=”javascript:void(0);” targe ...

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

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

  3. <a href="javascript:void(0)" onclick="ff()" ></a> 用法解析

    javascript:void(0) 仅仅表示一个死链接 如果是个# javascript:void(#),就会出现跳到顶部的情况,搜集了一下解决方法 1:<a href="####& ...

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

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

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

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

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

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

  7. 浅谈href=#与href=javascript:void(0)的区别

    #"包含了一个位置信息 默认的锚点是#top 也就是网页的上端 而javascript:void(0)  仅仅表示一个死链接 这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首 而 ...

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

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

  9. a href="javascript:void(0)"

    JavaScript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值. void 操作符用法格式如下: 1. javascript:void (expression) 2. javas ...

随机推荐

  1. Mybatis Mapper文件中的一小坑

    前几天来一需求,实现过程中需要修改一个底层的查询接口,具体修改就是在where中添加一个条件,由于这个底层SQL使用的地方太多,所以就想着是用if加一标识符做个判断,传一个只有我会使用的参数,然后动态 ...

  2. 判断以xx开头的字符串

    public static void main(String[] args) { String str = "EAN_13,1534651"; String strHttp = & ...

  3. Java script 逻辑运算符

    a && b : 将a, b转换为Boolean类型, 再执行逻辑与, true返回b, false返回a 1.只要“&&”前面是false,无论“&& ...

  4. React Native组件、生命周期及属性传值props详解

    创建组件的三种方式 第一种:通过ES6的方式创建 /** * 方式一 :ES6 */ export default class HelloComponent extends Component { r ...

  5. Nginx实现集群服务器的负载均衡

    1.安装nginx和tomcat 我这里是使用docker安装的.安装流程可参照 dockerfile 这里安装了两个tomcat,端口分别是42000和42001.第二个tomcat的首页随便加了些 ...

  6. Apache Storm 核心概念

    前言: Storm读取实时数据流,并传递给处理单元,最终输出处理后的数据. 下图描述了storm的处理数据的主要结构. 元组(Tuple) :       元组是Storm提供的一个轻量级的数据格式, ...

  7. LeetCode题解41.First Missing Positive

    41. First Missing Positive Given an unsorted integer array, find the first missing positive integer. ...

  8. [Swift]LeetCode111. 二叉树的最小深度 | Minimum Depth of Binary Tree

    Given a binary tree, find its minimum depth. The minimum depth is the number of nodes along the shor ...

  9. [Swift]LeetCode158. 用Read4来读取N个字符II $ Read N Characters Given Read4 II

    The API: int read4(char *buf) reads 4 characters at a time from a file. The return value is the actu ...

  10. [Swift]LeetCode259.三数之和较小值 $ 3Sum Smaller

    Given an array of n integers nums and a target, find the number of index triplets i, j, k with 0 < ...