Question

我想要一个带有必需广播组的html表单。如果选择此广播组中的某个特定选项，则会显示一个复选框组。只有在显示时才需要此复选框组。我怎么能这样做？最好是纯HTML，但如果绝对必要，也可以使用javascript。

由于

Answer 1

这样的事情应该有效：

＆＃13;

.checkbox-group {
  display: none;
}

[type=radio]:checked + .checkbox-group {
  display: block;
}

/*unneccessary*/
input { float: left;}
input[type=radio] { clear: both;}

＆＃13;

<input type="radio" name="radio[]" value="val1">
<div class="checkbox-group">
  <input type="checkbox" name="val1_checkbox[]" value="1"/>
  <input type="checkbox" name="val1_checkbox[]" value="2"/>
  <input type="checkbox" name="val1_checkbox[]" value="3"/>
</div>
<input type="radio" name="radio[]" value="val2">
<div class="checkbox-group">
  <input type="checkbox" name="val2_checkbox[]" value="1"/>
  <input type="checkbox" name="val2_checkbox[]" value="2"/>
  <input type="checkbox" name="val2_checkbox[]" value="3"/>
</div>
<input type="radio" name="radio[]" value="val3">
<div class="checkbox-group">
  <input type="checkbox" name="val3_checkbox[]" value="1"/>
  <input type="checkbox" name="val3_checkbox[]" value="2"/>
  <input type="checkbox" name="val3_checkbox[]" value="3"/>
</div>

＆＃13;

Answer 2

您可以使用以下代码供您参考（HTML和Javascript）：

＆＃13;

window.onload = function() {
		var rad = document.myForm.radioBtnNm;
		var prev = null;
		for (var i = 0; i < rad.length; i++) {
			rad[i].onclick = function() {
				
				if (this.checked == true) {
					if (this.value == "check1") {
						document.getElementById("checkboxDiv1").style.display = "none";
						document.getElementById("checkboxDiv2").style.display = "block";
					} else {
						document.getElementById("checkboxDiv1").style.display = "block";
						document.getElementById("checkboxDiv2").style.display = "none";
					}
				}
			};
		}

	}

＆＃13;

<form name="myForm" id="myForm">
		<div id="radioDiv">
			<input type="radio" name="radioBtnNm" value="check1">Show
			Chckbox list 1<br> <input type="radio" name="radioBtnNm"
				value="check2">Show Chckbox list 2<br>
		</div>

		<div id="checkboxDiv1" style="display: none">
			<br> <label>Checkbox List 1</label> <br> <input
				type="checkbox" name="checkbox1" value="one"> One<br> <input
				type="checkbox" name="checkbox1" value="two"> Two<br> <input
				type="checkbox" name="checkbox1" value="three"> Three<br>
		</div>

		<div id="checkboxDiv2" style="display: none">
			<br> <label>Checkbox List 2</label> <br> <input
				type="checkbox" name="checkbox2" value="three"> Three<br>
			<input type="checkbox" name="checkbox2" value="two"> Two<br>
			<input type="checkbox" name="checkbox2" value="one"> One<br>
		</div>
	</form>

＆＃13;

HTML - 如何根据广播组显示复选框组？

2 个答案: