Question

您好我正在为onpage子菜单开发这个简单的标签解决方案。它适用于2个选项“about-bio-txt”和“about-eb-txt”。当我尝试添加第三个选项时，我遇到了问题。我已将文本编辑为几个单词，但代码完全相同。

<ul id="switch-menu">

  <li id="about-eb" class="on"><a href="#" onclick='$("#about-bio-txt").hide(); $("#about-3").hide(); $("#about-eb-txt").show(); return false;'>About Everyday Bright</a></li>
  <li id="about-bio"><a href="#" onclick='$("#about-eb-txt").hide(); $("#about-3").hide(); $("#about-bio-txt").show(); return false;'>Bio</a></li>
enter code here
  <li id="about-3"><a href="#" onclick='$("#about-eb-txt").hide(); $("#about-bio-txt").hide(); $("#about-3").show(); return false;'>About Three</a></li>

标签的内容就在此菜单之前。

<div id="about-eb-txt">The Constitution</div>
<div id="about-bio-txt">Science is life</div>
<div id="about-3">I AM A TREE</div>

如果有人可以告诉我我做错了什么，以及是否可以在需要时添加更多标签，我就会徘徊。

Answer 1

第3个选项和相关标签容器的菜单div ID已被赋予相同的ID - ＃about-3

以下应该有效。同时减少了多个对象目标所需的JS对于相同的隐藏请求...

<li id="about-eb" class="on"><a href="#" onclick='$("#about-bio-txt, #about-3-txt").hide(); $("#about-eb-txt").show(); return false;'>About Everyday Bright</a></li>
<li id="about-bio"><a href="#" onclick='$("#about-eb-txt, #about-3-txt").hide(); $("#about-bio-txt").show(); return false;'>Bio</a></li>
<li id="about-3"><a href="#" onclick='$("#about-eb-txt, #about-bio-txt").hide(); $("#about-3").show(); return false;'>About Three</a></li>


<div id="about-eb-txt">The Constitution</div>
<div id="about-bio-txt">Science is life</div>
<div id="about-3-txt">I AM A TREE</div>

Onclick简单的JS菜单。我需要一些建议

1 个答案: