javascript – 获取URL的基本名称,然后将活动类放入导航栏

Example Link: http://localhost/test/page.PHP

我有一个JavaScript代码,如果href ==== current_url的url,它会将一个活动类放到导航栏.

Current JavaScript (Only puts active class to sidebar)

<script type="text/javascript">
jQuery(function($) {
    var path = window.location.href; // because the 'href' property of the DOM element is the absolute path
    $('ul a').each(function() { 
        if (this.href === path) {
            $(this).addClass('sub-menu active');
            $(this).parent().closest("li").addClass('active');
            $(this).parent().parent().closest("li").addClass('active');
        }
    });
}); 
</script>

如果链接有page.PHP成功,我也想让它工作.只要page.PHP在那里,无论后面是什么,都会有一个活跃的类.

我已经尝试过以下脚本来提取基本名称,但现在它根本不起作用,有或没有页面？

Tried script (Supposed to put active class to sidebar even if the url has page.PHP?success in it.

<script type="text/javascript">
jQuery(function($) {
    var patharray = window.location.pathname.split( '/' );
    var reallink = patharray[2]; 
    $('ul a').each(function() { 
        if (this.href === reallink) {
            $(this).addClass('sub-menu active');
            $(this).parent().closest("li").addClass('active');
            $(this).parent().parent().closest("li").addClass('active');
        }
    });
}); 
</script>

使用上面的示例链接.脚本返回page.PHP并且导航栏内的href只是page1.PHP,page2.PHP等…所以我知道它应该有效,因为检索到的reallink等于导航栏的href.

My sidebar

<li class="sub-menu"> // Sidebar with no submenu
  <a class="" href="page1.PHP">
    <i class="icon-calendar"></i>
    <span>This is page 1</span>
  </a>
</li>
<li class="sub-menu"> // Sidebar with a submenu
  <a href="javascript:;" class="">
    <i class="icon-group"></i>
    <span>This has sub pages</span>
    <span class="arrow"></span>
  </a>
  <ul class="sub">
    <li><a class="" href="page2.PHP">This is page 2</a></li>
    <li><a class="" href="page3.PHP">This is page 3</a></li>
  </ul>
</li>

因此,如果满足href = url,则第一个JavaScript将活动类放入父级和子级.但是第二个脚本没有用.

解决方法:

我想在第一个脚本中更改此行将使其工作

var path = window.location.href.split( '?' )[0];