jQuery select2 是一个高度可定制且易于使用的下拉选择框插件。在前端开发中，它经常用于实现可搜索和多选的下拉列表等组件。本文将介绍如何设置 jQuery select2 的选择值。
1. 安装和配置 jQuery select2
首先，你需要在你的项目中安装 jQuery select2 插件。你可以通过 npm 或者直接下载 jQuery select2 的源代码进行安装。
在页面中引入 select2 的样式文件：
<link href="/path/to/select2.min.css" rel="stylesheet" />
同时在页面底部引入 select2 的脚本文件和初始化代码：
<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/select2.min.js"></script>
<script>
$(document).ready(function() {
$('.select2').select2();
});
</script>这里我们假设你已经在 HTML 中创建了一个 class 为 "select2" 的 select 元素，并且已经成功地初始化了 select2 插件。
2. 设置 select2 的选择值
如果你需要动态地设置 select2 的选中值，可以使用以下两种方法：
方法一：通过 val() 方法设置
你可以通过 jQuery 的 val() 方法来设置 select2 的选中值。例如：
$('.select2').val('value').trigger('change');其中 value 就是你要设置的选中值。
需要注意的是，由于 select2 是一个自定义的下拉列表组件，所以你需要手动触发 change 事件来更新 select2 的选中状态。
方法二：通过 data() 方法设置
另外一种方法是使用 select2 提供的 data() 方法。这个方法可以获取或设置 select2 的数据集合，包括选中值、选项和其他相关信息。例如：
$('.select2').select2('data', {id: 'value', text: 'text'});其中 value 是你要设置的选中值的 ID，而 text 是对应的文本。
需要注意的是，如果你想设置多个选中值，你需要将它们作为一个数组传递给 data() 方法：
$('.select2').select2('data', [{id: 'value1', text: 'text1'}, {id: 'value2', text: 'text2'}]);3. 示例代码
下面是一个完整的示例代码，演示了如何在 select2 中设置选中值：
-- -------------------- ---- -------
--------- -----
----- -------------
------
----- ----------------
------------- ------- ----------
----- ------------------------------------------------------------------------------------ ---------------- --
-------
------
------- --------------- --------------------
------- ------------ ----------
------- ------------ ----------
------- ------------ ----------
------- ------------ ----------
------- ------------ ----------
---------
------- ---------------------------------------------------------------------------------
------- -------------------------------------------------------------------------------------------
--------
---------------------------- -
-----------------------
------------ ------
----------- ----
---
-- -----
----------------------- ------------------------
---
---------
-------
-------在这个示例中，我们首先初始化了一个 class 为 "select2" 的 select 元素，然后通过 val() 方法设置了它的选中值为 2 和 4。最终的效果是，在页面加载完成后，select2 中的选项 2 和 4 都会被默认选中。
总结
通过本文的介
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/15151