Select2 trigger选中所有复选框

Question

我正在使用Select2下拉框，我的要求是检查取消选中复选框的值。如果选中所有选项，则选中复选框，如果没有选中所有选项，则取消选中复选框。

HTML

<select multiple id="e1" style="width:300px"> 
    <option value="AL">Alabama</option> 
    <option value="Am">Amalapuram</option> 
    <option value="An">Anakapalli</option> 
    <option value="Ak">Akkayapalem</option> 
    <option value="WY">Wyoming</option> 
</select> 
<input type="checkbox" id="checkbox" >Select All 

<input type="button" id="button" value="check Selected"> 

JS

$("#e1").select2(); 
$("#checkbox").click(function(){ 
    if($("#checkbox").is(':checked')){ 
     $("#e1 > option").prop("selected","selected"); 
     $("#e1").trigger("change"); 
    }else{ 
     $("#e1 > option").removeAttr("selected"); 
     $("#e1").trigger("change"); 
    } 
}); 

$("#button").click(function(){ 
     alert($("#e1").val()); 
}); 

小提琴

http://jsfiddle.net/jEADR/62/。

Answer 1

你需要赶上变化的事件，当事件火，你需要检查选项多少选择，并与所有的选项比较：

$("#e1").on("change", function(e) { 

    var count = this.selectedOptions.length // how options selected 
    var opt = this.length; // how options total 

    if (count===opt) { 
     // all selected 
     $("#checkbox").prop('checked', true); 
    } else { 
     // not all selected 
     $("#checkbox").prop('checked', false);   
    } 
}); 

http://jsfiddle.net/jEADR/1834/