使用jQuery select2设置多个值[重复]

Posted

技术标签:

【中文标题】使用jQuery select2设置多个值[重复]【英文标题】:Setting multiple values using jQuery select2 [duplicate] 【发布时间】:2019-01-14 17:44:27 【问题描述】:

我使用 jQuery select2 来选择多个列表项。

但不幸的是,下面的代码必须将所有 3 个值都加载到选择字段中。但是它只加载第一项。

如何将所有 3 个项目加载到 select2 列表中?

<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】:

设置select中的值并使用触发change事件

$('#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>

【讨论】:

以上是关于使用jQuery select2设置多个值[重复]的主要内容,如果未能解决你的问题,请参考以下文章

如何在javascript变量中获取jquery select2选定值[重复]

使用 jquery 设置 select2 输入的值

使用 jQuery 从 select2 小部件中获取多个值并存储,然后重新加载它们

使用 asp.net 从后面的代码中获取 Jquery 的 Select2 的多个选定值

获取select2中选定选项的值,然后使用jquery将值设置为输入文本?

jquery select2设置输入值