[JavaScript知识库]select2 新增全选功能

html 配置

在select标签后新增

<select class="col-xs-10 col-sm-8" id="serverip" name="serverip" multiple="multiple">
   {% for server_record in server_list%}
      <option value="{{server_record.serverip}}">{{server_record.serverip}}</option>
   {%endfor%}
</select>
<button class="btn btn-info" type="button" onclick="chooseSelect2All()">
   <i class="icon-ok bigger-110"></i>
   全选
</button>

js代码如下

//select2全选所有的选项
function chooseSelect2All() {
    //document的对象，可以取到option
    var item = document.getElementById("serverip")
    //jquery的对象，用来指定select2控件的选择项
    var item_jq = $('#serverip');
    var option_list = [];
        for(var i=0; i< item.length;i++){
            var optionVal = item[i].getAttribute('value');
            option_list.push(optionVal);
        }
        item_jq.val(option_list).trigger("change");
}