在不同页面上的菜单上突出显示

Question

我要做的是当我点击主菜单或子菜单时，应突出显示主菜单元素

在我的例子中：如果我点击Menu1，我应该去index.php，li应该有class =＆＃34;选择＆＃34;

如果我去了Menu2Submenu1，我应该去test.php，而Menu2的li应该有class =＆＃34; select＆＃34;。

＆＃13;

＆＃13;

jQuery(document).ready(function($){
  // Get current path and find target link
  var path = window.location.pathname.split("/").pop();
  
  // Account for home page with empty path
  if ( path == '' ) {
    path = 'index.php';
  }
      
  var target = $('li a[href="'+path+'"]');
  // Add active class to target link
  target.addClass('selected');
});

＆＃13;

li.selected {
    background-color: #000;
}

＆＃13;

<div class="page-row bg-blue clearfix">
    <div class="page-position landmark">
        <ul id="topmenu" class="clearfix">
            <li style="width:8%;">
                <a href="index.php">Menu1</a>
                    </li>
            <li style="width:21%;">
                <a href="#">Menu2</a>
                    <ul class="submenu">
                        <li>
                            <a href="test.php">Menu2Submenu1</a>
                        </li>
                        <li>
                            <a href="#">Menu2Submenu2</a>
                        </li>
                    </ul>
             </li>
            <li style="width:23%;">
                <a href="#">Menu3</a>
                        <ul class="submenu">
                            <li>
                                <a href="#">Menu3Submenu1</a>
                            </li>
                        <li>
                            <a href="#">Menu3Submenu2</a>
                        </li>
                        </ul>
            </li>
        </ul>
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

target.addClass('selected'); 

在'a'元素中添加一个不在'li'元素中的类。

或者你的css只用'li'元素

target.parent().addClass('selected');