前天一同事遇到个看似很诡异的问题,就是<a href="javascript:void(0);" onclick="window.location.href=url"></a>在IE6下面没反应,不跳转到onclik事件中的"window.location.href"。

当时我们在网上找了篇文章很快就解决了,但是文章中没有说明具体原因在哪里,只是说在"window.location.href"后面加一个"return false",当时马上建了个test.html,试了下确实可以,而且试了之后还发现IE6下是被href="javascript:void(0)"覆盖了,这问题看上去很简单,但是为什么其他浏览器没有被覆盖,但对原因到底在哪里还是一头雾水。

为了更深入地去研究<a>中href和和onclik的执行到底是神马个情况,做了以下试验,试验所用的浏览器是IE6、7、8和Firefox8.0.1。为了视觉上更好的观察,我们将a的样式设置为"display:block;line-height:28px";为了观察href和onclik是否都执行了,我们将<a>属性设置target="_blank",因为它只对a中的href链接起作用,即打开href中的链接会新增一个窗口;为了观察onclik和href的执行顺序,我们在为设置"return false"的onclik事件后面添加"alert('怎么执行')",因为alert会中断所有浏览器线程。以下是试验代码:

1
2
3
4
5
6
7
8
<html>
  <head>
  <style>
    a{display:block; line-height:28px}
    p{margin: 3px 0 12px;}
  </style>
  </head>
<body>   

A:

1
<a href="javascript:void(0);" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击A</a>

点击A后,IE中url马上变成了http://www.fclub.cn,然后弹窗,把弹窗点掉后当前页面马上进入了聚尚网首页,最后再新打开一个地址为javascript:void(0)的空页面;在Firefox中,当前页的url也马上变成了http://www.fclub.cn,然后弹窗,不同的是,弹窗没有完全阻断UI线程,自动跳转到了聚尚网首页,并且没有新打开一个地址为javascript:void(0)的页面。

B:

1
<a href="javascript:void(0);" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')">点击B</a>

点击B后,在IE6中,浏览器任务框中的url马上变成了http://www.fclub.cn,然后弹窗,点掉弹窗后,当前页面url变成了javascript:void(0),进入一个空白页;IE6以上版本,点击后url变成了http://www.fclub.cn,然后弹窗,点掉弹窗后进入聚尚网首页;在Firefox中,表现和A中一样。

C:

1
<a href="#" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击C</a>

点击C后,在IE各版本都是url马上变成了http://www.fclub.cn,然后弹窗,点掉弹窗后,在另一个窗口打开一个新的聚尚网首页;在Firefox中,表现和A中一样。

D:

1
<a href="#" onclick="window.location.href='http://www.fclub.cn';return false" target="_blank">点击D</a>

点击D后,IE各版本和Firefox都是直接进入了聚尚网首页。

E:

1
<a href="javascript:void(0);" onclick="window.location.href='http://www.fclub.cn';return false" target="_blank">点击E</a>

点击E后,IE各版本和Firefox都是直接进入了聚尚网首页。

F:

1
<a href="http://www.google.com" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击F</a>

点击F后,IE各版本都是当前页url变成http://www.fclub.cn,然后弹窗,点掉弹窗后当前页进入了聚尚网首页,并且新打开一个Google页面;Firefox中,先是url变成http://www.fclub.cn,然后弹窗,点掉弹窗后,当前窗口进入聚尚网首页,与IE不同的是,不以任何形式打开Google首页。

G:

1
<a href="http://www.google.com" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行');return false" target="_blank">点击G</a>

点击G后,IE各版本都是当前页url变成http://www.fclub.cn,然后弹窗,点掉弹窗后当前页进入了聚尚网首页,没有新打开一个Google页面;Firefox中,表现和F一样。

H:

1
<a href="http://www.google.com" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击H</a>

点击H后,IE各版本及Firefox表现和G一样。

I:

1
<a href="http://www.google.comn" onclick="return false;" target="_blank">点击I</a>

点击I后,IE各版本及Firefox都没有任何,href也都没有执行。

J:

1
<a href="http://www.google.com" onclick="alert('怎么执行')" target="_blank">点击J</a>

点击J后,IE各版本和火狐都是先弹窗,点掉弹窗后,在新的页面中打开Google首页。

总结:通过A-J这11个试验用例我们可以发现以下情况:

1、通过弹窗和打开新页面的顺序可以发现,在IE各个版本和Firefox中,都是先执行onclick事件,再执行href,onclick事件的优先级高于href。

2、在Firefox中,如果onclick中有可用的"window.location.href",则直接进入"window.location.href"中的url链接,不再执行<a>标签中的href,如果onclik中无可用"window.location.href",则会进入<a>标签中href中的链接。

3、通过I以及其他onclick中有"return false"试验用例的表现,可以看出,href的执行被onclik中的return false阻断了。

4、在IE各个版本中如果<a>标签中"target=_self",则最后进入的是href中的有效url。

5、当href中的值只是锚点或空,则IE各版本和Firefox都不会把它当作链接处理,即不会进入href的值。但是当href="javascript:void(0)",IE6会把它当作有效url处理,而进入url="javascript:void(0)"的一个空页面,IE6以上版本和Firefox则把不它当作有效url处理。

转自:http://hoogle.blog.51cto.com/1793311/739022

IE6下window.location.href不跳转到相应url的更多相关文章

  1. JavaScript在IE6下超级链接window.location.href不跳转的bug 及 解决方案

    今天遇到个很诡异的问题,就是<a href="javascript:void(0);" onclick="window.location.href=url" ...

  2. 关于window.location.href页面跳转的坑

    "window.location.href"."location.href"是本页面跳转 "parent.location.href"是上一 ...

  3. window.location.href无法跳转

    onclick事件存在事件冒泡 所以要阻止它冒泡 解决:在onclick事件里添加return false阻止冒泡:onclick="window.location.href='XXXXX. ...

  4. html中submit和button的区别/ window.location.href 不跳转 的问题

    <input type="button">  <input type="submit"> 这两个的区别 是 button 不会自动提交表 ...

  5. 微信BUG之微信内置的浏览器中window.location.href 不跳转

    最近做微信开发遇到这个问题,查了一些文档,总结一下 1.url后面加参数 indow.location.href = url +'?timestamp='+ new Date().getTime()+ ...

  6. window.location.href无法跳转的解决办法

    -------------------接收别人做的SSO单点登录项目,无源码,只是点击登出按钮一直不跳转. 原因是: <a href="javascript:;" oncli ...

  7. 遇到问题-----JS中设置window.location.href跳转无效(在a标签里或这form表单里)

    问题情况 JS中设置window.location.href跳转无效 代码如下: ? 1 2 3 4 5 6 7 8 <script type="text/javascript&quo ...

  8. javascript 中设置window.location.href跳转无效问题解决办法

    javascript 中设置window.location.href跳转无效问题解决办法 问题情况 JS中设置window.location.href跳转无效 原因是 a标签的href跳转会执行在wi ...

  9. window.location.href跳转无效

    window.location.href跳转无效     问题情况 JS中设置window.location.href跳转无效   原因是 a标签的href跳转会执行在window.location. ...

随机推荐

  1. PHP泛域名应用

    以Windows开发环境 1.windows =>hosts文件 127.0.0.1    asia.t127.0.0.1    *.asia.t127.0.0.1    www.asia.t1 ...

  2. UNIX基础知识之出错处理

    当UNIX函数出错时,常常会返回一个负值,而且整型变量errno通常被设置为含有附加信息的一个值.例如,open函数如成功执行则返回一个非负文件描述符,如出错则返回-1.在open出错时,有大约15种 ...

  3. 关于php配置文件

    一:配置文件(php.ini)在 PHP 启动时被读取.对于服务器模块版本的 PHP,仅在 web 服务器启动时读取一次.对于 CGI 和 CLI 版本,每次调用都会读取. 二:Note that t ...

  4. Sublime Text 2 实用快捷键[Mac OS X]

    lucasfais 总结了一些非常实用的 Sublime Text 2 快捷键,Lucifr 将它们翻译成了中文,以方便查阅. 注意:修饰键(如⌘)后跟多个按键的情况表示在按住修饰键的情况下依次按下相 ...

  5. IE Firefox Safari 下 通过Div“隐藏”设置Accesskey的submit input

    实现效果: 进入页面后 通过快捷键  如Alt+C 调用相关的隐藏按钮 实现功能操作 正常情况下 设置 button => input type="submit" acces ...

  6. [改善Java代码]不推荐使用binarySearch对列表进行检索

    对一个列表进行检索时,我们使用的最多的是indexOf方法,它简单好用,而且也不会出错,虽然它只能检索到第一个符合条件的值,但是我们可以生成子列表后再检索.这样也就可以查找到所有符合条件的值了. Co ...

  7. hdu 1495 非常可乐 广搜

    #include<iostream> #include<cstdio> #include<cstring> #include<queue> ][][]; ...

  8. iOS下编译ffmpeg

    网络上搜索“ios ffmpeg 编译”,文章一大把,但我编译还是费了很大的功夫才编译成功.很多文章只是把步骤列了出来,但是每个人的系统环境,或者程序版本都不一样,结果出现各种的错误.我把自己编译过程 ...

  9. poj3264

    Balanced Lineup Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 45777   Accepted: 21499 ...

  10. C#中显/隐式实现接口及其访问方法

    原贴地址: http://www.cnblogs.com/dudu837/archive/2009/12/07/1618663.html 在实现接口的时候,VS提供了两个菜单,一个是"实现接 ...