以下代码可以正常使用:
function toggleVis(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
<label onclick='toggleVis("weapon-set");' for='checkboxes-0'>
<input type='checkbox' name='checkboxes' id='checkboxes-0' value='1'>
Weapon
</label>
<fieldset id='weapon-set' class='toggle'><legend>Weapon</legend></fieldset>
我可以单击复选框或标签以打开或关闭字段集的可见性。但是,如果我将fieldset的初始可见性设置为display:none;使用CSS选择器,我只能使用复选框来切换可见性。关于如何使标签切换正常工作的任何想法?
答案 0 :(得分:1)
使用班级来切换可见性
function toggleVis(id) {
var elem = document.getElementById(id);
elem.classList.toggle("hidden");
}
&#13;
.hidden { display : none }
&#13;
<label for='checkboxes-0'>
<input type='checkbox' name='checkboxes' id='checkboxes-0' value='1' onchange='toggleVis("weapon-set");'>
Weapon
</label>
<fieldset id='weapon-set' class='toggle'><legend>Weapon</legend></fieldset>
&#13;
您也可以将其基于复选框状态而不是默认状态。