1

つまり、基本的に、ページにはたくさんのチェックボックスがあります。

<input type="checkbox" id="check" name="1">
<input type="checkbox" id="check" name="2">
<input type="checkbox" id="check" name="3">

チェックボックスがチェックされているかどうかを検出し、名前に基づいて何かを実行するためのjavascriptコードが必要です。これは、次のとおりです。

$('#check').click(function()...

ただし、これは1つのチェックボックスのみを処理し、上記のように複数のチェックボックスがある場合は機能しません。私はおそらくそれらをたくさん持っているので、私はそれらを一つずつチェックしたくないので、助けていただければ幸いです、みんなありがとう！

4

3 に答える 3

4

クリックをidでバインドしており、3つのコントロールすべてが同じIDを持っています。htmlコントロールに一意のIDを指定する必要があります。これらをグループ化するには、共通のクラスを割り当てる方が適切です。チェックボックスのIDを変更して一意にしました。

<input type="checkbox" id="check1" name="1" class="someclass">
<input type="checkbox" id="check2" name="2" class="someclass">
<input type="checkbox" id="check3" name="3" class="someclass">


$('.someclass').click(function()...

チェックされたチェックボックスをオンにするには

ライブデモ

$('#btn').click(function() {
    $('.someclass').each(function() {
       alert("checkbox id =" + this.id + " checked status " + this.checked);
    });
});​

他のチェックボックスの変更時にチェックボックスのグループをチェックするには

ライブデモ

<input type="checkbox" id="check1" name="1" class="someclass">
<input type="checkbox" id="check2" name="2" class="someclass">
<input type="checkbox" id="check3" name="3" class="someclass">
<label> <input id="chkall" type="checkbox" text=""aa /> check all </label>
​

$('#chkall').click(function() {
    $('.someclass').attr('checked', this.checked);
});​
于 2012-10-27T07:07:24.103 に答える
1

ただし、これは1つのチェックボックスのみを処理し、上記のように複数のチェックボックスがある場合は機能しません。

これは、idセレクターを使用する場合、jQueryは最初に見つかった要素のみを返すためです。IDは一意である必要があります。

ドキュメントによると：

各id値は、ドキュメント内で1回だけ使用する必要があります。複数の要素に同じIDが割り当てられている場合、そのIDを使用するクエリは、DOMで最初に一致した要素のみを選択します。ただし、この動作に依存するべきではありません。同じIDを使用する複数の要素を持つドキュメントは無効です。

要素をグループ化する必要がある場合は、クラスを割り当てることができます。

<input type="checkbox" id="check1" class="checkbox-group1">
<input type="checkbox" id="check2" class="checkbox-group1">
<input type="checkbox" id="check3" class="checkbox-group1">

...クラスで選択するクリックイベントを添付します。

$('.checkbox-group1').click(function(){...})

または、データ属性を使用できます。

<input type="checkbox" id="check1" data-group="checkbox-group1">
<input type="checkbox" id="check2" data-group="checkbox-group1">
<input type="checkbox" id="check3" data-group="checkbox-group1">

...データ属性で選択するクリックイベントを添付します。

$('input[data-group="checkbox-group1"]').click(function(){...})

デモ

于 2012-10-27T07:11:40.977 に答える
0

マークアップは無効です（マークアップバリデーターからわかるように）：id属性値はドキュメント内で一意である必要があります。チェックボックスの場合、id属性は主に、のようにコントロールをそのラベルに関連付けるために使用され<input type="checkbox" id="sugar" name="addon" value="sugar"><label for="sugar">Sugar</label>ます。

したがって、チェックボックスを参照するために何か他のものが必要です。ページ上のすべてのチェックボックスを参照するには、を使用できます$('input[type=checkbox]')。ただし、特定のチェックボックスのセットを特定の方法で処理する場合、最も自然な方法は、おそらくnameそれらで同じ属性を使用することです。

<input type="checkbox" name="addon" value="sugar">
<input type="checkbox" name="addon" value="cream">
<input type="checkbox" name="addon" value="milk">

を使用します$('[name=addon]')。このアプローチでは、送信されるデータには、1 = on、2 = onなどのフィールドではなく、addon = sugar、addon=creamなどのフィールドが含まれることに注意してnameくださいvalue。

于 2012-10-27T07:45:26.557 に答える