Question

我有一个页面，其中包含使用单个ID进行样式设置的菜单。页面是用ajax动态加载的，所以菜单php网站总是一样的。问题是我想在菜单中为这些ID使用活动状态。我怎么能用php或javascript做到这一点？我看到的所有教程只使用了一个单独的类。

<nav>
   <ul class="navi">
     <li><a id="menu1" href="page1.php">Page 1</a></li>
     <li><a id="menu2" href="page2.php">Page 2</a></li>
     <li><a id="menu3" href="page3.php">Page 3</a></li>
     <li><a id="menu4" href="page4.php">Page 4</a></li>
     <li><a id="menu5" href="page5.php">Page 5</a></li>
   </ul>
</nav>

CSS：

a#menu1 {
  color: #999794;
  width: 73px;
  height: 28px;
}
a#menu1:hover {
  background-image: url(Photos.png);
  background-repeat: no-repeat;
  padding-top: 5px;
  margin-top: -5px;
  width: 73px;
  height: 28px;
}
a#menu1:active {
  background-image: url(Photos.png);
  background-repeat: no-repeat;
  padding-top: 5px;
  margin-top: -5px;
  width: 73px;
  height: 28px;
}

Answer 1

如果你动态加载页面，点击每个链接，然后在你的ajax调用后的javascript中

试试这个：

  $("#menu1").css({"background-image":"url(Photos.png)","background-repeat":"no-repeat","padding-top":"5px","margin-top":"-5px","width":"73px","height":"28px"});

或

  $(this).css({"background-image":"url(Photos.png)","background-repeat":"no-repeat","padding-top":"5px","margin-top":"-5px","width":"73px","height":"28px"});

使用单个ID将活动状态添加到菜单

1 个答案: