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 網站了解該產品的詳細功能。