チェックボックスのチェックすべてが正しく機能していない

Question

私はフォームフィールドを持っています。ここには、国とその他のメンバーシップを含む2つのフィールドがあり、両方にチェックボックスがあります。問題は、すべての国を選択する（国のすべてのチェックボックスをオンまたはオフにする）ために使用しているコードでも、メンバシップフィールドをチェックするかチェックしないことです。私は、メンバーシップ分野のチェックボックスではなく、国のみをチェックするように、2つを区別したいと思います。

$("#checkCountries").click(function(){ 
    $('input:checkbox').not(this).prop('checked', this.checked); 
}); 

EDIT：HTMLのPARTここ

<tr> 
    <th>Target Memberships</th> 
    <td> 
     <div class="target-memberships col-sm-8"> 
     <input type="checkbox" value="1" name="memberships[]" checked> Standard<br> 
     <input type="checkbox" value="2" name="memberships[]" checked> Premium<br> 
     <input type="checkbox" value="3" name="memberships[]" checked> Elite<br> 
     </div> 
    </td> 
</tr> 
<tr> 
    <th>Target Countries</th> 
    <td> 
     <input type="checkbox" id="checkCountries" checked> Select All<br> 
     <div class="target-countries col-sm-8"> 
     <input type="checkbox" name="country[]" id="country" value="Afghanistan" checked> Afghanistan<br> 
     <input type="checkbox" name="country[]" id="country" value="Albania" checked> Albania<br> 
     <input type="checkbox" name="country[]" id="country" value="Algeria" checked> Algeria<br> 
     <input type="checkbox" name="country[]" id="country" value="American Samoa" checked> American Samoa<br> 
     <input type="checkbox" name="country[]" id="country" value="Andorra" checked> Andorra<br> 
     <input type="checkbox" name="country[]" id="country" value="Angola" checked> Angola<br> 
     </div> 
    </td> 
</tr> 

、は、ページ内のすべてのチェックボックス上で動作するコードを作っている。ここ

は、私が使用していたコードです。私は、特定の分野（国）でのみ動作するように、これを変更する必要があると思います。助けてください。

Answer 1

は、あなたのHTMLは次のようにある場合：

<input type="checkbox" id="checkCountries" checked="checked"> Select All<br> 
<div class="target-countries col-sm-8"> 
    <input type="checkbox" name="country[]" id="country-1" value="Afghanistan" checked="checked" /> Afghanistan<br> 
    <input type="checkbox" name="country[]" id="country-2" value="Albania" checked="checked" /> Albania<br> 
    <input type="checkbox" name="country[]" id="country-3" value="Algeria" checked="checked" /> Algeria<br> 
    <input type="checkbox" name="country[]" id="country-4" value="American Samoa" checked="checked" /> American Samoa<br> 
    <input type="checkbox" name="country[]" id="country-5" value="Andorra" checked="checked" /> Andorra<br> 
    <input type="checkbox" name="country[]" id="country-6" value="Angola" checked="checked" /> Angola<br> 
</div> 

HTMLでは、各idは一意である必要があります。 nameは、配列を定義する必要がある場合と同じですが、country[]ですが、idは各要素に対して一意である必要があります。 inputには終了タグがないので、タグの末尾にたとえば、<input type="checkbox" />を追加することをお勧めします。

あなたはこれを使用することができます：

$("#checkCountries").click(function(){ 
    $(".target-countries input[type='checkbox']").prop("checked", $(this).prop("checked")); 
}); 

これはクラスセレクタtarget-countriesとタイプcheckboxである内inputの要素を標的とします。次に、現在のチェックボックスの値と一致するようにプロパティcheckedを設定します。

ワーキングスニペット：

$(function() { 
 
    $("#checkCountries").click(function() { 
 
    $(".target-countries input[type='checkbox']").prop("checked", $(this).prop("checked")); 
 
    }); 
 
});

.target-countries { 
 
    margin: 3px; 
 
    border: 1px solid #CCC; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="checkCountries" checked="checked"> Select All<br> 
 
<div class="target-countries col-sm-8"> 
 
    <input type="checkbox" name="country[]" id="country-1" value="Afghanistan" checked="checked" /> Afghanistan<br> 
 
    <input type="checkbox" name="country[]" id="country-2" value="Albania" checked="checked" /> Albania<br> 
 
    <input type="checkbox" name="country[]" id="country-3" value="Algeria" checked="checked" /> Algeria<br> 
 
    <input type="checkbox" name="country[]" id="country-4" value="American Samoa" checked="checked" /> American Samoa<br> 
 
    <input type="checkbox" name="country[]" id="country-5" value="Andorra" checked="checked" /> Andorra<br> 
 
    <input type="checkbox" name="country[]" id="country-6" value="Angola" checked="checked" /> Angola<br> 
 
</div>

お役に立てば幸いです。