我正在尝试显示onClick或onSelect上的几个复选框。我有一个'标准'复选框,选中后,应显示一个标准选项表,我有一个“自定义”复选框,选中后,应显示一个自定义选项表。
现在表格切换但不会同时显示。换句话说,如果两者都被选中,我需要显示两个表,一个在另一个下面。如果仅选中“标准”,则仅显示“标准”选项,如果仅选中“自定义”,则仅显示“自定义”选项。
这是一个小提琴:http://jsfiddle.net/4tcRD/2/
这是我的JS:
function toggleTables(which)
{
if(which == "1") {
document.getElementById('customize').style.display = "table";
document.getElementById('standard').style.display = "none";
}
if(which == "2") {
document.getElementById('standard').style.display = "table";
document.getElementById('customize').style.display = "none";
}
}
这是我的HTML:
<input name="checkbox1" type="checkbox" id="customize_1" onClick="toggleTables('2')" value="checkbox" />
<label for="checkbox1"></label> Standard
<input name="checkbox2" type="checkbox" id="customize_0" onClick="toggleTables('1')" value="checkbox" checked="checked" />
Customize
<br />
<table width="100%" class="imagetable" cellpadding="0" cellspacing="0" id="customize">
<tr><td>customize</td></tr>
</table>
<table width="100%" class="imagetable" cellpadding="0" cellspacing="0" id="standard" style="display: none">
<tr><td>standard</td></tr>
</table>
请帮帮忙。 - 更新为CHECKBOXES **
答案 0 :(得分:2)
只需检查功能中复选框的状态即可。
function toggleTables()
{
var isCustomize = document.getElementById('customize_1').checked;
var isStandard = document.getElementById('standard_1').checked;
var customize = document.getElementById('customize');
var standard = document.getElementById('standard');
customize.style.display = isCustomize ? 'table' : 'none';
standard.style.display = isStandard ? 'table' : 'none';
}