javascript - Javascript：想要 2 个不同的文本链接来显示 2 个不同的 div（在同一个地方）

Question

不确定我是否应该使用 z-index 或隐藏方法，我尝试了几种不同的方法，但无法为我工作。

我可以获得一个链接来显示一个，甚至在两者之间有一个链接洗牌，但我似乎无法获得 2 个不同的链接来处理两个不同的 div。

现在的代码是：

    function toggle_visibility("music" , "contact") {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
           e.style.display = 'block';

}

<a href="#" onclick="toggle_visibility("music");">music</a>
<a href="#" onclick="toggle_visibility("contact");">contact</a>

<div id="music" style="display:none;"> stuff </div>

<div id="contact"> stuff </div>

Answer 1

也许像下面这样？

http://jsfiddle.net/vhzAR/

HTML：

<a href="#" id="music_toggle">music</a>
<a href="#" id="contact_toggle">contact</a>
<div id="music" style="display:none;"> music stuff </div>
<div id="contact"> contact stuff </div>

JavaScript：

function toggle_visibility(enable, disable) {
    var e = document.getElementById(enable);
    e.style.display = 'block';
    e = document.getElementById(disable);
    e.style.display = 'none';
}

document.getElementById('music_toggle').onclick = function() {
    toggle_visibility('music', 'contact');
};

document.getElementById('contact_toggle').onclick = function() {
    toggle_visibility('contact', 'music');
};