2

混合入力のグループ要素の1つを選択するにはどうすればよいですか？

私は次のコードを持っています：

<div class="item">
  <input type="radio" name="group1" value="value1">Value1</input>
  <input type="radio" name="group1" value="value2">Value2</input>
  <input type="radio" name="group1" value="value3">Value3</input>
  <textarea name="group1"></textarea>
</div>
  <div class="item">
  <input type="radio" name="group2" value="value1">Value1</input>
  <input type="radio" name="group2" value="value2">Value2</input>
  <input type="radio" name="group2" value="value3">Value3</input>
  <textarea name="group2"></textarea>
</div>

私は考えます：textareaをクリックすると、ラジオボタンは属性を失うcheckedはずです。好き：

$('.item textarea').on('click', function(){
  $($(this).parent + 'input[type="radio":checked]').each(function(){
    $(this).checked = false;
  });
});

しかし、それは機能しません。オブジェクトの問題だと思いparentます。ありがとう。

4

2 に答える 2

3

あなたのバリアントには多くの問題があります。まず、セレクターの構造に問題があります: $($(this).parent + 'input[type="radio":checked]'). ここでは、jQuery オブジェクトと文字列セレクターを混在させていますが、これは正しくありません。さらに、親要素はメソッドで取得されparent()ますが、プロパティでは取得されません。checked次に、jQuery オブジェクトには属性がありません。

説明されているすべての問題を考慮すると、次の実行可能なコードを取得できます。

$('.item textarea').on('click', function() {
    $(this).siblings(":radio").prop("checked", false);
});

デモ: http://jsfiddle.net/TEk9c/

ちなみに、ユーザーがtextareaマウスだけでなくclickキーボードで入力したときにすべてのラジオのチェックを外す必要がある場合は、focus代わりにイベントを使用できます。

于 2012-05-08T07:53:50.237 に答える
1

属性に基づいて作成したい場合は、 Attribute Equals Selectornameを使用できます:

$('.item textarea').on('click', function() {
    $(':radio[name="' + this.name + '"]').prop("checked", false);
});

必要なラジオ ボタンが常に同じdiv.itemにある場合は、より厳密なソリューションを作成することもできます。この例では、最初に class を持つ最も近い親を見つけ、その中で同じ属性itemを持つラジオを検索します。name

$('.item textarea').on('click', function() {
    $(this).closest('.item')
        .find(':radio[name="' + this.name + '"]')
            .prop("checked", false);
});

1 つの有効性に関する注意:<input>はvoid 要素であり、内部に内容を持ち、終了属性を持つことはできません。要素を使用して<label>、ラベルを付ける必要があります。

<label><input type="radio" name="group1" value="value1" /> Value1</label>

ラベルが追加された jsFiddle デモ

于 2012-05-08T07:59:37.723 に答える