解决IE6点击链接无法跳转

出于减少空链接的目的,对于非实际链接而是触发 JS 效果的 a 标签,我一般都是使用 “javascript:;” 来设其 href 值而不是 “#”,然而最近碰上在 IE6 下这种情况无法跳转页面的情况:比如说,对于一个 href 为 “javascript:;” 的 a 链接,绑定点击时通过设置 window.location.href 来进行页面跳转,但在 IE6 下会无法进行跳转。实际上代码没有出错,location 后面的语句也可以执行的。

解决方法有二:

  1. 点击处理函数增加阻止默认事件
  2. reset href

对于 IE6,阻止默认事件可以简单使用

1
if (window.event) window.event.returnValue = false

至于 reset href,则是将触发事件的链接改为 ‘#’,然后再调整;或者直接将其 href 值改为需要的目标地址。

Demo

关于跳转

如果查看我 demo 的源代码,会发现里面有个函数如下:

1
2
3
4
5
6
7
8
9
10
11
12
function jumpTo (url) {
    var isIE = !-[1,];
    if (isIE) {
        var link = document.createElement("a");
        link.href = url;
        link.style.display = 'none';
        document.body.appendChild(link);
        link.click();
    } else {
        window.location.href = url;
    }
}

之所以写这个一个函数来负责页面跳转,这中间是有原因的。一般情况下,我们会直接使用 location.href 来跳转,但在 IE 下是会丢失 http refer 头的,也就是说,这种情况下,后台监测将会丢失部分数据,无法获取到页面跳转信息,则网站统计失真。


References:

  1. IE6中a标签location.href失效解决方法
  2. CH9004: IE Firefox 在进行某些跳转时请求头中不会附加 Referer 字段信息

P.S. 有时候,没有实际经历过,即便看过一次又一次,也许也无法真正有记忆。比如这个跳转问题,很久以前就看过了参考文章一,但遇上的时候却苦苦纠结,最后又 Google 进去的时候才发现:哦,原来我看过了。

《解决IE6点击链接无法跳转》有4个想法

    1. @布布 一般来说,我都写不出什么高深的东西,只是记录一下,以免各种失忆 😎

评论已关闭。