所选 Link class 在 inet 资源管理器中未正确显示

Question

我通过 java 脚本创建了一个选定的 link class 以突出显示用户当前所在页面的菜单 link：

<script>
$(document).ready(function(){
  $('a').each(function(){
    if($(this).prop('href')==window.location.href){
       $(this).addClass('selected');
  }});
});
</script>

然后我在 css 中编辑了 link 个状态：

#topnavindex        {width:17%;float:left;position:fixed;}
#topnavindex ul     {margin:4% 0 0 10%;}
#topnavindex ul li  {font-size:83%;letter-spacing:3px;margin:0 0 1.7% 0;list-style-type:none;}
#topnavindex a      {font-weight:bold;text-decoration:none;}
#topnavindex a:link {color:#8a523e;}
#topnav a:link      {color:#232323;}
#topnav a:visited   {color:#232323;}
#topnav a:hover     {color:#27a896;}
#topnav a.selected  {color:#27a896;}

虽然 Chrome 和 Firefox 正确显示我的网站，但 Internet Explorer 会忽略所选 link 属性。

Answer 1

由于您引用锚点的方式（通过父元素），来自这些 CSS 规则的样式优先于您的 "selected" class.

将您的 "selected" class 引用为（通过与其他规则相同的方式通过父元素）：

#topnav a.selected

应该能让您删除“!important”标签

鉴于您是 JS，您可能希望在开始选择器上更加具体，而不仅仅是 $("a").each。这将最终循环遍历您将来可能在您的网站上拥有的每个 link。您可以简单地在其中添加 #topnav 以使其仅查看相关锚点。

$("topnav a").each...

Answer 2

感谢所有帮助我解决问题的人。解决方案比预期的要简单。

我不得不将 IE 设置（"Advanced"-选项卡）更改为 "Allow active content to run files on my computer"。之后IE就可以识别JavaScript了！

这个问题只是因为我的文件保存在本地。在实时网页上，脚本最有可能在不更改 IE 设置的情况下为观众工作。

所选 Link class 在 inet 资源管理器中未正确显示

Selected Link class not showing correctly on inet explorer

javascript

css

highlight

hyperlink