使用 Twitter Bootstrap 的 IE8 中的超链接不起作用答案

【问题标题】：Hyperlinks not working in IE8 with Twitter Bootstrap使用 Twitter Bootstrap 的 IE8 中的超链接不起作用
【发布时间】：2014-05-20 09:47:20
【问题描述】：

我已经到处寻找解决这个问题的方法，但我似乎找不到它！

我使用 Twitter Bootstrap 的警报类制作了自己的旧浏览器警报，警报下的内容上有黑色覆盖，看起来很棒，但我想要警报中的超链接将用户带到 http://browsehappy.com/ 哪里然后他们可以更新他们的浏览器。但是超链接在 IE 中没有任何作用 - 它适用于其他一切（甚至 IE7！）但在 IE8 中它只是显示为蓝色并且不可点击。

我制作了一个带有条件 cmets 的 JSFiddle，所以你可以看到我在做什么：

http://jsfiddle.net/X3tKs/2/

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<div id="black" style="width:100%;height:100%;background-color:black;opacity:0.8;filter:alpha(opacity=80);position:absolute;top:52px;z-index:3000;"></div>
<div class="alert alert-danger">
    Yikes! You're using an old browser! This page might not work the way it should. <a href="http://browsehappy.com" target="_blank">Time to update!</a>
</div>

任何帮助将不胜感激！

更新： 原来使用在线浏览器模拟器只是我的错！感谢@joshhunt 对此的评论 - 我将链接发送给我的朋友，他有一台 Windows 计算机，他们确认它可以正常工作，实际上是 Browserstack 不能正常工作。我试着把所有东西都拿出来——引导样式、黑色 div（感谢@OJay）但它仍然没有用，所以我认为它不可能是我的代码。是时候投资购买一台旧的 Windows 笔记本电脑进行测试了！ :)

【问题讨论】：

试试js方案，要不要用jQuery？
我愿意尝试任何事情来让它发挥作用！你有什么建议？
JS Fiddle (fiddle.jshell.net/X3tKs/2/show) 似乎在 Windows XP IE8 和 Windows 7 IE8 中都可以正常工作。
原来使用在线浏览器模拟器只是我的错！感谢@joshhunt 对此的评论 - 我将链接发送给我的朋友，他有一台 Windows 计算机，他们确认它可以正常工作，实际上是 Browserstack 不能正常工作。我试着把所有东西都拿出来——引导样式、黑色 div（感谢@OJay）但它仍然没有用，所以我认为它不可能是我的代码。是时候投资购买一台旧的 Windows 笔记本电脑进行测试了！ :)
是的，IE 模拟器是出了名的不准确；参见例如github.com/twbs/bootstrap/pull/13422

标签： html twitter-bootstrap internet-explorer-8 href alert

【解决方案1】：

HTML

<div class="alert alert-danger">
    Yikes! You're using an old browser! This page might not work the way it should. <a href="http://browsehappy.com" id="update_link" target="_blank">Time to update!</a>
</div>

jQuery

$("#update_link").click(function(){
    var url = "http://browsehappy.com";
    window.open(url, '_blank');
});

CSS

#update_link{
    cursor:pointer;
}

【讨论】：