获取单选按钮值的onload和隐藏或显示DIV

Question

我有以下的jsfiddle设置：

http://jsfiddle.net/cvn6n/

基于无线电选择一个div被隐藏或显示（如果选择奥迪的股利是隐藏的，如果选择了其他值，则显示div）。我遇到的问题是我需要检测单选按钮的初始值（onload），并相应地隐藏或显示div。

Audi <input type="radio" name="car" id="audi" value="3" checked="checked" onclick="toggle(this)"> 
<br /> 
Merc <input type="radio" name="car" id="merc" value="3" onclick="toggle(this)"> 
<br /> 
BMW <input type="radio" name="car" id="bmw" value="3" onclick="toggle(this)"> 
<br /><br /> 
<div id="testdiv"> 
Not Audi 
</div> 

var t = document.getElementById('testdiv'); 

t.style.visibility = 'visible';     
function toggle(switchElement) { 
    if (switchElement.id != 'audi'){ 
     t.style.display = 'inline'; 
    }else{ 
     t.style.display = 'none'; 
    } 
} 

感谢您的帮助提前。

ps。没有jQuery，请只是单纯的JS解决方案

Answer 1

[].forEach.call(document.forms.carform.car, function(radio){ 
     if(radio.checked) { 
      toggle(radio); 
     } 
}); 

http://jsfiddle.net/cvn6n/1/

Answer 2

从你的榜样，注意到我感动的积极价值，芝加哥商业交易所，也注意到你应该设置显示：没有你的testdiv当你初始化：

Audi <input type="radio" name="car" id="audi" value="3" onclick="toggle(this)"> 
<br /> 
Merc <input type="radio" name="car" id="merc" value="3" checked="checked" onclick="toggle(this)"> 
<br /> 
BMW <input type="radio" name="car" id="bmw" value="3" onclick="toggle(this)"> 
<br /><br /> 
<div id="testdiv" style="display:none;"> 
Not Audi 
</div> 

对于javascript，您可以将我添加到window.onload或您的页面底部的部分放入，因此在DOM完成加载后触发。基本上，它会检查提供的ID列表，并为活动的ID设置toggle（）。

var t = document.getElementById('testdiv'); 

t.style.visibility = 'visible';     
function toggle(switchElement) { 
    if (switchElement.id != 'audi') { 
     t.style.display = 'inline'; 
    }else{ 
     t.style.display = 'none'; 
    } 
} 

var listOfIds = new Array("audi", "merc", "bmw"); 
for (x in listOfIds) { 
    var element = document.getElementById(listOfIds[x]); 
    if (element.checked) { 
     toggle(element); 
    } 
}