如何显示/隐藏 div答案

【问题标题】：How to show/hide divs如何显示/隐藏 div
【发布时间】：2013-07-21 04:57:15
【问题描述】：

我正在尝试弄清楚如何做到这一点...我有 4 个 div，我希望一次显示和隐藏一个。 div 的链接位于单独的嵌套 div 中。这是我的代码：

<div id="container">
    <div class="roundbox">
        <ul>
            <li class="t">
                <a href="">Main</a>
            </li>
            <li class="e">
                <a href="">News</a>
            </li>
            <li class="t">
                <a href="">History</a>
            </li>
            <li class="e">
                <a href="">Contact</a>
            </li>
        </ul>
    </div>
    <div class="inceptioncontent">
        <div class="content">
            <div class="contentnest">
                <div id="1"></div>
                <div id="2"></div>
                <div id="3"></div>
                <div id="4"></div>
            </div>
        </div>
    </div>
</div>

我希望 Main、News、Contact 和 History 链接显示/隐藏 contentnest div 中的相应 div。有任何想法吗？谢谢！

【问题讨论】：

标签： html show-hide

【解决方案1】：

JQuery 擅长做他的事情。这看起来是个不错的起点：http://papermashup.com/simple-jquery-showhide-div/

【讨论】：

这是JSFiddle按照你的例子做的。
jsfiddle.net/7W4KL/11 我根据您的 JSFiddle Shahar 提出了上述部分解决方案。我现在想知道怎么做是让它一次只有一个 div 可见。有什么帮助吗？
之所以被选为答案，是因为它引导我朝着正确的方向前进。使用jQuery完成任务。

【解决方案2】：

您似乎在寻找下拉菜单。你可以做到这一点：用 Javascript + css 编码（使用像 jQuery 这样的框架会更容易） ;使用 CSS ;下载插件

我认为“Css only”是最好的方式，jQuery 很酷，下载一个插件是最简单的方式，但是你需要打开用户资源管理器的 js。

您可以在此处查看如何仅使用 css 进行操作：

https://www.grc.com/menudemo.htm

【讨论】：