显示：无/块样式选项卡使用按钮和Javascript创建菜单

Question

function tab_menu(){ 
  if (buttonObject.value == value){
    document.getElementById("div1").style.display = "block";
  }
}

当我点击按钮检查按钮值并根据Button的值显示一个div并隐藏其他div时，它应该同时显示一个div。我想知道有一个javascript Master可以解决这个问题。

Answer 1

SCRIPT：

function tabmenu(buttonObject){ 
    var value = buttonObject.value
    var target = document.getElementById(value);

    if(target) {
       var siblings = target.parentNode.getElementsByTagName("DIV");
       for(i=0;i<siblings.length;i++){
          siblings[i].style.display = "none";
       }
       target.style.display = "block";
    }

}

HTML：

<div>
    <div id="tab1">Tab1</div>
    <div id="tab2">Tab2</div>
    <div id="tab3">Tab3</div>
</div>

<button onclick="tabmenu(this);" value="tab1">Tab1</button>
<button onclick="tabmenu(this);" value="tab2">Tab2</button>

1. 找到要激活的标签（假设值= tab.id）
2. 找到父母，因此是兄弟姐妹（假设他们是DIV）
3. 隐藏兄弟姐妹
4. 显示目标

您可以在此处看到它：http://jsfiddle.net/4rWdQ/