如何使用Jquery显示与点击链接相关的DIV并隐藏其他DIV？

Question

正如我在主题中总结的那样，我想显示与单击的链接相关的 DIV 并使用 Jquery 隐藏其他 DIV。为了能够理解我在说什么，请访问 Worldlines

您将在那里看到与一些新闻相关的主题。当有人单击某个主题时，新闻 div 将滑落到单击的主题下方，之前阅读的新闻 div 将隐藏。

我想我已经清楚地表达了我想要的东西。

谢谢你，

Answer 1

您将在 html 的开头添加一个脚本，如下所示：

<script type="text/javascript" src="/jquery-1.4.1.min.js"></script> 
<script type="text/javascript">

    function showPanel2() {
    $('#Panel1').hide();
    $('#Panel2').show();
    }

</script>

这将隐藏一个面板并显示另一个面板。 “Panel1”和“Panel2”只是您要显示或隐藏的面板的 ID。然后您的按钮上将包含以下代码：

 <input type="button" onclick="showPanel2();" value="Submit" />

如果您想隐藏多个面板，这应该足够简单，可以进行修改。

Answer 2

Jquery Accordion 正是我所寻找的。您可以在这里找到它 http://jqueryui.com/demos/accordion/