使用 Jquery 突出显示基于查询字符串的链接

Question

我在动态 aspx 页面的侧边栏中有一个菜单。 我想根据查询字符串值高亮当前链接。

<div id="verticalmenu">
<ul>
<li><a href="services.aspx?pageid=11">Medical Transcription</a></li>
<li><a href="services.aspx?pageid=12">Business Transcription</a></li>
 <li><a href="services.aspx?pageid=13">Legal Transcription</a></li>
  <li><a href="services.aspx?pageid=14">Insurance Transcription</a></li>
  <li><a href="services.aspx?pageid=15">Data Entry & Processing</a></li>
  <li><a href="services.aspx?pageid=16">Software Development</a></li>
  <li>  <a  href="services.aspx?pageid=25">Typesetting Services</a></li>
</ul>
</div>

Answer 1

使用 jQuery，它可能看起来像这样：

$('#verticalmenu a').each(function (){
    var linktext = $(this).attr('href');
    if (linktext.search(window.location.search.substring(1)) > -1){
       $(this).addClass('current');
    }
});

使用window.location.search.substring(1) 获取url 的最后一部分，并使用javascript 字符串的search 方法检查链接的href 属性。然后为样式添加一个类名。例如，我使用了current。

它可能需要一些调整，但这是要走的路。但是，我强烈建议在服务器端执行此链接识别。这是一个我不太引以为豪的解决方法。