仅当 URL 处于活动状态时显示子导航 ul

Question

我正在使用修改后的引导导航栏（垂直而不是水平），并且仅在 5 个页面中的一个处于活动状态时才希望显示子菜单。我目前正在使用 toggleClass，但用户无需单击导航栏即可访问菜单，这会阻止切换子导航 .visible 类。

如果以下任何页面处于活动状态，则应显示子导航：

menu.php,
starters.php,
entrees.php,
vegan.php
sides.php,

导航栏

<nav class="navbar navbar-default" role="navigation">
  <!-- Brand and toggle get grouped for better mobile display -->
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <div>
        <img class="img-responsive brandImg" src="images/SSSLogoHome.png" alt="SSS Logo">
    </div>
  </div>
  <!-- Collect the nav links, forms, and other content for toggling -->
  <div class="collapse navbar-collapse navbar-ex1-collapse">
    <ul class="nav navbar-nav">
      <li><a href="index.php">About Us</a></li>
      <li class="menuNav"><a href="menu.php">Menu</a>
          <ul class="sub-nav">
            <li>Starters</li>
            <li>Entrees</li>
            <li>Vegan and Vegetarian</li>
            <li>Sides and Desserts</li>
          </ul>
      </li>
      <li><a href="gallery.php">Gallery</a></li>
      <li><a href="promotions.php">Promotions</a></li>
      <li><a href="contact.php">Private Dining</a></li>
    </ul>
  </div><!-- /.navbar-collapse -->
</nav>

Answer 1

你可以做这样的事情：

$url = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$url_names = array('menu.php','starters.php','entrees.php','vegan.php','sides.php');
$find = $i = 0;
while( $find == 0 && $i<count($url_names) ) {
    if ( strpos($url, $url_names[$i]) === FALSE ) {
        $i++;
    }
    else {
        // print menu
        $find = 1;
    }
}

Answer 2

可能有一个更干净的方法，但这非常有效：

var urlMenu = window.location.href;
if (urlMenu.search("menu.php") >= 0 || urlMenu.search("sides.php") >= 0 || urlMenu.search("entrees.php") >= 0 || urlMenu.search("starters.php") >= 0 || urlMenu.search("vegan.php") >= 0) {
    $('.sub-nav').show();
} else {
    $('.sub-nav').hide();
}