Setting multiple values using jQuery select2 [duplicate]

问题

I use jQuery select2 to choose more than one list item.

But unfortunately, the below code must have all 3 values being loaded into the select field. However it loads only the first item.

How do I load all the 3 items into the select2 list?

<head>
<script  src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
</head>
<body>
    <select id="e1" style="width:400px">
        <option value="AL">Alabama</option>
        <option value="NY">New york</option>        
        <option value="WY">Wyoming</option>
    </select>
    <script>
    var selectedValuesTest = ["WY","AL", "NY"];
    $(document).ready(function() {
        $("#e1").select2({
                multiple: true,
            });
            $('#e1').select2('val', selectedValuesTest);
    });
    </script>    
</body>

回答1:

Set the value in select and trigger the change event using

$('#e1').val(selectedValuesTest).trigger('change');

var selectedValuesTest = ["WY", "AL", "NY"];
$(document).ready(function() {
  $("#e1").select2({
    multiple: true,
  });
  $('#e1').val(selectedValuesTest).trigger('change');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

<select id="e1" style="width:400px" name="states[]">
  <option value="AL">Alabama</option>
  <option value="NY">New york</option>
  <option value="WY">Wyoming</option>
</select>

来源：https://stackoverflow.com/questions/51730090/setting-multiple-values-using-jquery-select2

标签

javascript

jquery

html

select

jquery-select2