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

Posted 2023-05-07

【中文标题】使用 jQuery 从 select2 小部件中获取多个值并存储，然后重新加载它们

【英文标题】：Use jQuery to get multiple values from select2 widget and store, then reload them

【发布时间】：2014-03-04 00:15:36

【问题描述】：

“Select2” 表示： http://ivaynberg.github.io/select2/

现在，我的问题是：我有 select2 小部件的硬编码源，例如：

<select>
    <option value = "1">A</option>
    <option value = "2">B</option>
    <option value = "3">C</option>
</select>

然后，当我选择 A 和 B 两个选项时，并使用：

var result = $("#id").select2("val"); 

我可以得到结果等于A，B。 所以接下来当我想重新加载结果时：

$("#id").select2("val", result);

它不能成功，因为小部件不能分开它们是两个不同的选项。

我该如何解决这个问题，不能使用split(",") 命令，因为可能有些选项有逗号。

【问题讨论】：

另一个关于它的讨论***.com/questions/12889552/…

其实我的问题和那个不一样，他用一个数组来存储选中的值，而我的问题是：当我得到选中的值作为字符串时，例如：“1 ,2"，那么如何将字符串存储到数组中？就像array[0] = 1, array[1] = 2，不能使用split(",")。

【参考方案1】：

好的，让我们做点什么，我刚刚在 fiddle 上创建了一个示例，我们可以对其进行处理，这样你就可以做你需要的。

到目前为止，这就是我所能做的，您可以在顶部 select2 上选择多个项目，然后按一个按钮，获取所选项目，然后在不同的 select2 上选择完全相同的项目（值中包含逗号）。这几乎就是您想要做的（保存和恢复）。

小提琴在http://jsfiddle.net/5P9Zc/

$(".mimicValues").click(function() 
    var test = $(".origin").val();
    // Save the values into TEST
    $(".origin").val().forEach(function(entry) 
    console.log(entry);
);
   alert(test);
   // Restore the values in TEST
   $(".mimic").val(test);
);

另外，请注意您使用的 select2 的版本，较新的版本有一些增强功能。

【讨论】：

非常感谢，这也是我选择这样做的原因。实际上我只是更改为不使用：var result = $("#id").select2("val");，而是使用：$("#id").val().split('||');。那么不同的值可以不用逗号分隔。

其实因为我只是用了select2 2.1版本，所以不支持修改select2 widget中的分隔符内容。如果我将其更改为 3.4.5 版本，它会提供分隔符构造函数。这是链接：ivaynberg.github.io/select2/index.html#documentation