Jquery - 根据您点击的链接显示不同的 div答案

【问题标题】：Jquery - Show different divs depending on which link you click onJquery - 根据您点击的链接显示不同的 div
【发布时间】：2013-10-14 08:58:55
【问题描述】：

我有一个包含不同链接的网页。

链接 #1
链接 #2
链接 #3
等等。

我希望这些链接显示从一开始就隐藏的不同 div。 Link #1 应该显示 Div #1 等等。如果 Div #1 打开并且我按下 Link #3，则 Div #1 应该被隐藏，而 Div #3 应该出现。

链接 #1 - 显示 div #1 并隐藏 #2 和 #3
Link #2 - 显示 Div #2 并隐藏 #1 和 #3
Link #3 - 显示 Div #3 并隐藏 #1 和 #2
等等。

如何以最好的方式解决这个问题？

谢谢！

【问题讨论】：

代码目前做了什么？有什么错误吗？
我改写了问题是否更有意义，请立即查看。

标签： jquery function show-hide function-call

【解决方案1】：

<a id="Link1" class="links" href="#" data-showdiv="Div1">Link 1</a>
<a id="Link2" class="links" href="#" data-showdiv="Div2">Link 2</a>
<a id="Link3" class="links" href="#" data-showdiv="Div3">Link 3</a>
etc...

<div id="Div1" class="divs"></div>
<div id="Div2" class="divs"></div>
<div id="Div3" class="divs"></div>
etc...

$(".links").click(function(){
    $("divs:visible").hide();
    $("#"+$(this).attr("data-showdiv")).show();
});

【讨论】：

可能需要 .divs:visible 而不是 divs:visible。注意“divs”之前的“.”。