1 
<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 では正しく動作しません! 最初のチェック ボックスをクリックすると、2 番目のチェック ボックスが自動的に選択されます。お願い助けて

4

1 に答える 1

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/を参照してください。コードには他にも問題があることに注意したいのですが、これはあなたが言及した問題に対処しています。

于 2013-02-05T05:21:04.337 に答える