Select2多选组件通过jQuery设置选中值后展示异常问题

问题原因 #

• 第二种写法错误：zz.split(',') 本身已经是一维数组，外层额外加[]后会生成二维数组 [["1","2"]]，Select2和jQuery的val()方法都不支持传入二维数组作为选中值，因此无任何选中效果。
• 第一种写法错误：select2("val") 是Select2 3.x版本的旧API，如果你使用的是目前主流的4.x及以上版本，该API兼容表现不稳定，容易出现仅识别第一个选中值的问题。

解决方法 #

直接使用原生jQuery的val()方法赋值后触发change事件即可，不需要调用Select2封装的特殊赋值方法，示例代码如下：

var zz = '1,2';
// 分割得到一维字符串数组，若你的option value为数字类型，可加.map(Number)转成数字数组
var selectedValues = zz.split(',');
$('.dataCreate #' + a).val(selectedValues).trigger('change');

注意事项 #

• 确认你的select标签已经开启了多选属性：<select multiple>
• 确认select下所有option的value值和你传入数组的元素类型、值完全匹配，避免因类型不匹配导致匹配失败

内容的提问来源于stack exchange，提问作者Hala Atef