<html>
<body>
<script>
function show_mcap()
{
if(document.form1.marriage.checked)
document.getElementById("m_cap1").innerHTML="Hall Capacity<br><input type=text name=hall[]><br>Dining Hall capacity<br><input type=text name=d_hall[]><br>Rent<br><input type=text name=rent[]>"
else
document.getElementById("m_cap1").innerHTML=""
}
function show_bcap()
{
if(document.getElementById("bday").checked)
{
document.getElementById("b_cap1").innerHTML="Hall Capacity<br><input type=text name=hall[]><br>Dining Hall capacity<br><input type=text name=d_hall[]><br>Rent<br><input type=text name=rent[]>"
}
else
document.getElementById("b_cap1").innerHTML=""
}
</script>
<form name="form1">
<table>
<tr>
<td width="230"><label for="bday">
<input type="checkbox" name="category[]" value="marraige" id="marriage" onClick="show_mcap()">Marriage/Reception
</td>
<td width="227">
<input type="checkbox" name="bday" value="bday" id="bday" onClick="show_bcap()">Bday
</td>
</tr>
<tr>
<td><div id="m_cap1"></div></td>
<td><div id="b_cap1"></div></td>
</tr>
</table>
</form>
</body>
</html>
这是我写的代码。此代码在chrome,Internet Explorer,opera中运行良好。但是在mozilla中无法正常工作!当我点击第一个复选框时,会自动选中第二个复选框!请帮帮我
答案 0 :(得分:4)
我认为这与你的标签有关。您将“marraige”周围的标签指定为“bday”。将其更改为“marraige”,它应该按预期运行。
即改变:
<td width="230"><label for="bday">
<input type="checkbox" name="category[]" value="marraige" id="marriage" onClick="show_mcap()">Marriage/Reception
</td>
要
<td width="230">
<label for="marriage">
<input type="checkbox" id="marriage" onClick="show_mcap()">Marriage/Reception
</label>
</td>
有关在Firefox中测试的工作示例,请参阅http://jsfiddle.net/JGMMj/。我想注意代码中还有其他问题,但这解决了你提到的问题。