jquery - 使用javascript和onclick显示div

我已经阅读了很多关于此的文章，但我仍在努力。我正在尝试使用一些简单的Java显示和隐藏div类。我可以在JSFiddle中使用它，但不能在我的实时站点上使用它。

这是我正在使用的代码。 HTML优先

<div id="mydiv1">
    <div id="mydiv-container">
        <div id="mydiv-content">
            <h1>Here's The Popup 1</h1>
            <br>Click the link to close.
            <br>
            <a href="#" onclick="show('mydiv2')">Open 2</a>
        </div>
    </div>
</div>

<div id="mydiv2"  style="display:none">
    <div id="mydiv-container">
        <div id="mydiv-content">
            <h1>Here's The Popup 2</h1>
            <br>Click the link to close.
            <br>
            <a href="#" onclick="hide('mydiv2')">Close 2</a>
        </div>
    </div>
</div>

JavaScript：

function show(target) {
document.getElementById(target).style.display = 'block';
}

function hide(target) {
document.getElementById(target).style.display = 'none';
}

无法锻炼为什么它不会在实时服务器上切换div。

最佳答案

我认为您服务器上的问题是id，即mydiv1和mydiv2不是唯一的。 id在重复。

检查您的服务器上是否没有id复制。

id应该始终是唯一的。

您可以在Firefox和Chrome上使用Web Developer扩展名。
在页面上获取重复的id


在浏览器上安装Web Developer
通过单击Web Developer图标打开选项
点击Information标签
点击Find Duplicate Ids


希望这会有所帮助。

要下载工具栏：

铬：
https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm?utm_source=chrome-app-launcher-info-dialog

Firefox：
https://addons.mozilla.org/en-US/firefox/addon/web-developer/?src=userprofile

关于jquery - 使用javascript和onclick显示div，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30258825/