Jquery - Select2 安装和设置

Created: November-22, 2018

你可以通过以下两种方式之一包含/安装 Select2

直接在项目主题部分的项目中使用 CDN。

link href =“ https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css “rel =”stylesheet“/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"/>

将代码下载到本地计算机并将其包含在项目中。它看起来应该是这样的

然后将这些行包含在 html 页面的 head 部分中

  <link href="select2.min.css" rel="stylesheet" />
  <script src="select2.min.js"></script>

注意：你需要在项目中包含 Jquery 才能使 Select2 正常工作。

PITFALL：如果当前版本的 jquery 和 Select2 存在冲突，或者 Select2 功能不起作用。然后将 select2 变量和实现移动到单独的文档体块$（document）.ready（function(){// your select2 code …..}）;

使用方法： 你可以按如下方式定义 <select>：

<select id="select2_example">
    <option>Test</option>
</select>

Approach1：

      var _mSelect2 = $("#select_example").select2();

Approach2：

  <script type="text/javascript">
      $('select').select2();
  </script>

请注意，使用此方法，所有定义的选择页面控件都将继承 Select2 的功能。如果你只想对某些控件使用 Select2，请跳过此步骤并编写自己的代码以直接使用 select2 功能，并将 jquery / javascript 功能分别用于其他选择控件。但是，你可以使用通过 Select2 操作 Jquery 的值，反之亦然。

基础知识的更多示例可以在这里的 Select2 GIT 文档中找到

Select2 GIT 项目就在这里。请浏览 Select2 Github 网站了解该产品的详细功能。