IE6中location不跳转问题

来源：互联网发布：linux程序编辑：程序博客网时间：2024/06/05 14:08

http://www.cnblogs.com/lollipop/archive/2012/12/10/2811236.html

---

说明下我遇到的问题：

IE6下点击<a href="javascrip:void(0);" onclick="submitform();"/>点击之后设置断点也进入action处理完成并返回了，但是页面通过IETESTER 的DEBUG BAR看一直是页面下载中。。然后页面上没有任何变化，action后台处理后返回该页面并带回一个错误信息，按说应该在这个页面有个错误信息显示才对。

最终解决方法：将href="#" 即可。

前天一我遇到个看似很诡异的问题，就是<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和Firefox 8.0.1。为了视觉上更好的观察，我们将a的样式设置为"display:block; line-height:28px"；为了观察href和onclik是否都执行了，我们将<a>属性设置target="_blank"，因为它只对a中的href链接起作用，即打开href中的链接会新增一个窗口；为了观察onclik和href的执行顺序，我们在为设置"return false"的onclik事件后面添加"alert('怎么执行')"，因为alert会中断所有浏览器线程。以下是试验代码：

 1 <html> 2 <head> 3 <style> 4 a{display:block; line-height:28px} 5 p{margin: 3px 0 12px;} 6 </style> 7 </head> 8   9 <body>   10 A:  <a href="javascript:void(0);" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击A</a>11 <p> 点击A后，IE中url马上变成了http://www.fclub.cn，然后弹窗，把弹窗点掉后当前页面马上进入了聚尚网首页，最后再新打开一个地址为javascript:void(0)的空页面；在Firefox中，当前页的url也马上变成了http://www.fclub.cn，然后弹窗，不同的是，弹窗没有完全阻断UI线程，自动跳转到了聚尚网首页，并且没有新打开一个地址为javascript:void(0)的页面。</p>12 B:  <a href="javascript:void(0);" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')">点击B</a>13 <p> 点击B后，在IE6中，浏览器任务框中的url马上变成了http://www.fclub.cn，然后弹窗，点掉弹窗后，当前页面url变成了javascript:void(0)，进入一个空白页；IE6以上版本，点击后url变成了http://www.fclub.cn，然后弹窗，点掉弹窗后进入聚尚网首页；在Firefox中，表现和A中一样。</p>14 </br>15  16 C:  <a href="#" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击C</a>17 <p>点击C后，在IE各版本都是url马上变成了http://www.fclub.cn，然后弹窗，点掉弹窗后，在另一个窗口打开一个新的聚尚网首页；在Firefox中，表现和A中一样。</p>18 D:  <a href="#" onclick="window.location.href='http://www.fclub.cn';return false" target="_blank">点击D</a>19 <p> 点击D后，IE各版本和Firefox都是直接进入了聚尚网首页。</p>20 E:  <a href="javascript:void(0);" onclick="window.location.href='http://www.fclub.cn';return false" target="_blank">点击E</a>21 <p> 点击E后，IE各版本和Firefox都是直接进入了聚尚网首页。</p>22 </br>23  24 F:  <a href="http://www.google.com" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击F</a>25 <p> 点击F后，IE各版本都是当前页url变成http://www.fclub.cn，然后弹窗，点掉弹窗后当前页进入了聚尚网首页，并且新打开一个Google页面；Firefox中，先是url变成http://www.fclub.cn，然后弹窗，点掉弹窗后，当前窗口进入聚尚网首页，与IE不同的是，不以任何形式打开Google首页。</p>26 G:  <a href="http://www.google.com" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行');return false" target="_blank">点击G</a>27 <p>点击G后，IE各版本都是当前页url变成http://www.fclub.cn，然后弹窗，点掉弹窗后当前页进入了聚尚网首页，没有新打开一个Google页面；Firefox中，表现和F一样。</p>28 H:  <a href="http://www.google.com" onclick="window.location.href='http://www.fclub.cn';alert('怎么执行')" target="_blank">点击H</a>29 <p> 点击H后，IE各版本及Firefox表现和G一样。</p>30 </br>31  32 I:  <a href="http://www.google.comn" onclick="return false;" target="_blank">点击I</a>33 <p> 点击I后，IE各版本及Firefox都没有任何，href也都没有执行。</p>34 </br>35  36 J:  <a href="http://www.google.com" onclick="alert('怎么执行')" target="_blank">点击J</a>37 <p> 点击J后，IE各版本和火狐都是先弹窗，点掉弹窗后，在新的页面中打开Google首页。</p>38 </body>39 </html>40

总结：通过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处理。

0 0