複数のチェックボックスで属性を変更するためのクリーンな方法はありますか？

Question

私はチェックボックスの束を持っている：

<input type="checkbox" name="foo" value="1" /> 
<input type="checkbox" name="foo" value="2" /> 
<input type="checkbox" name="foo" value="3" /> 
<input type="checkbox" name="foo" value="4" /> 
<input type="checkbox" name="foo" value="5" /> 
<input type="checkbox" name="foo" value="6" /> 

私はcheckedは値1、3と5とのものを属性を変更したい下記よりセレクタを提供するために、きれいな方法があります（好ましくはワンライナー）？

$('[name="foo"][value="1"],[name="foo"][value="3"],[name="foo"][value="4"]').prop({ checked: true }).change(); 

P.S.

$('[name="foo"]').filter('[value="1"],[value="3"],[value="4"]').prop({ checked: true }).change(); 

Answer 1

あなたが事前にチェックしたい指標を知っていれば、私が思う、あなたが手動でそれらを配置する必要はありません：より良い方法が見つかりましたスニペット

$([1, 3, 5].map(x => `[name="foo"][value="${x}"]`).join(",")).prop({ checked: true }).change(); 

を空想ES6矢印機能を使用していますテンプレートリテラル。あなたがそれらを使用できない場合、それは少し厄介に見えますが、それでもあまりにも悪いことではありません。

$([1, 3, 5].map(function(x) { return '[name="foo"][value="' + x + '"]').join(",")).prop({ checked: true }).change(); 

は最後に、あなたも同じセレクタでそれらのすべてを収集せずにそれを行うことができます。

[1,3,5].forEach(x => { $(`[name="foo][value="${x}"]`).prop({ checked: true }).change(); }); 

を

私はあなたの毒を選ぶと思います。

Answer 2

フィルタ（）

var checkVals = [1, 3 , 5]; 
 
// Adjust selector to fit needs 
 
$(':checkbox').filter(function() { 
 
    return checkVals.indexOf(+this.value) > -1; 
 
}).prop('checked', true);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" name="foo" value="1" /> 
 
<input type="checkbox" name="foo" value="2" /> 
 
<input type="checkbox" name="foo" value="3" /> 
 
<input type="checkbox" name="foo" value="4" /> 
 
<input type="checkbox" name="foo" value="5" /> 
 
<input type="checkbox" name="foo" value="6" />

を

var checkVals = [1, 3 , 5]; 
 
// Adjust selector to fit needs 
 
$(':checkbox').prop('checked', function(){ 
 
    return checkVals.indexOf(+this.value) > -1 || this.checked; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" name="foo" value="1" /> 
 
<input type="checkbox" name="foo" value="2" /> 
 
<input type="checkbox" name="foo" value="3" /> 
 
<input type="checkbox" name="foo" value="4" /> 
 
<input type="checkbox" name="foo" value="5" /> 
 
<input type="checkbox" name="foo" value="6" />

ような何かを行うことができprop(propertyName, function)を使用して、または使用して