1

私のページにはマルチフォームがあり、ラジオボタン「disabled_radio」をクリックすると、そのラジオボタン「radio_enabled_disabled」が無効になりますが、相対フォームIDの場合です。

<td>
<form method="post" name="form1" id="form1" action="send.php">
   <div id="choice">
   <input type="radio" name="enabled_radio" value="yes" />YES
   <input type="radio" name="disabled_radio" value="no" />NO
   </div>
   <div id="mydiv">
   <input type="radio" name="radio_enabled_disabled" />
   </div>
</form>
</td>
<td>
<form method="post" name="form2" id="form2" action="send.php">
   <div id="choice">
   <input type="radio" name="enabled_radio" value="yes" />YES
   <input type="radio" name="disabled_radio" value="no" />NO
   </div>
   <div id="mydiv">
   <input type="radio" name="radio_enabled_disabled" />
   </div>
</form>
</td>
4

2 に答える 2

1

まず、再利用された ID とグループ化に使用されるラジオ名のない固定 HTML が必要です。

<form method="post" name="form1" id="form1" action="send.php">
   <input type="radio" name="enable_radio" value="yes">YES
   <input type="radio" name="enable_radio" value="no">NO
   <input type="radio" name="radio_enabled_disabled">
</form>
<form method="post" name="form2" id="form2" action="send.php">
   <input type="radio" name="enable_radio" value="yes">YES
   <input type="radio" name="enable_radio" value="no">NO
   <input type="radio" name="radio_enabled_disabled">
</form>
<form method="post" name="form3" id="form3" action="send.php">
   <input type="radio" name="enable_radio" value="yes">YES
   <input type="radio" name="enable_radio" value="no">NO
   <input type="radio" name="radio_enabled_disabled">
</form>

次に、これを行うことができます：

$('[name=enable_radio]').change(function(){
    $(this).parent().find('[name="radio_enabled_disabled"]')
       .prop('disabled',this.value=='yes')
});

デモンストレーション

于 2013-02-15T11:51:07.773 に答える
0

あなたの HTML にはいくつかの問題がありますが、これはあなたがやろうとしていることを表示するために含めたサンプル コードにすぎないと仮定します。

radio 要素が有効/無効にするフォームの子である場合、このparent()関数を使用して DOM の 1 レベル上に移動し、フォーム要素に到達できます。

$('input.disabled_radio').on('click',function(){
  $(this.parent().find('input[name="radio_enabled_disabled"]').prop('disabled','disabled');
});

このコードは、相対的な親フォーム要素を見つけ、その中に含まれる各入力要素の無効なプロパティを設定します。

個人的には、自分のコードをできる限り冗長にするのが好きです。これにより可読性が大幅に向上することがわかりました。そのため、代わりにjQuery のclosest()関数parent()を使用することをお勧めします。このclosest()関数では、探している親要素のタイプを指定する必要があります。したがって、コードは次のようになります-

$('input.disabled_radio').on('click',function(){
  $(this.closest('form').find('input[name="radio_enabled_disabled"]').prop('disabled','disabled');
});

その後、ラジオ ボタンを再度有効にするには、その無効なプロパティを削除する必要があります。そのために、これを使用できます-

.prop('disabled','');
于 2013-02-15T11:51:48.377 に答える