开发者

Highlight Link based on Query string using Jquery

开发者 https://www.devze.com 2023-03-26 10:04 出处:网络
I have a menu in the sidebar in a dynamic aspx page. I wan开发者_开发问答t to highlight the current link based on the query string value.

I have a menu in the sidebar in a dynamic aspx page. I wan开发者_开发问答t to highlight the current link based on the query string value.

<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>


With jQuery, it could look something like this:

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

Use window.location.search.substring(1) to take the last part of the url, and check it against the href attribute of your links using the search method for javascript-strings. Then add a classname for the styling purpose. I used current for example.

It might need some tweaking, but this is the way to go. However, I would strongly recommend to do this link-recognition serverside. This is a workaround I'm not too proud of.

0

精彩评论

暂无评论...
验证码 换一张
取 消