如何使用Select2获得一个简单的多选框

问题描述 投票:0回答:1

我想在我的 html 文档中使用 select2 库,因为它有一个 pillbox 样式选择控件我想使用。

我遵循了文档中相关的安装入门部分。我还使用 CDN 链接加载了 JQuery,但正如你在下面看到的,我收到了一个错误:

$(document).ready(function() {
  $('.js-example-basic-multiple').select2();
});
<html>
  <head>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" />
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js">             </script>
  </head>
  <body>
        <select class="js-example-basic-multiple" name="states[]" multiple="multiple">
        <option value="AL">Alabama</option>
        <option value="WY">Wyoming</option>
    </select>
  </body>
</html>

我在这里缺少什么?

javascript html jquery jquery-select2 cdn
1个回答
0
投票

你应该先导入jquery脚本,然后你可以使用select2.min.js。

<html>
  <head>
<linkhref="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
  </head>
  <body>
    <select
      class="js-example-basic-multiple"
      name="states[]"
      multiple="multiple"
    >
      <option value="AL">Alabama</option>
      <option value="WY">Wyoming</option>
    </select>
  </body>
  <script>
    $(document).ready(function () {
    $(".js-example-basic-multiple").select2();
    });
  </script>
</html>
© www.soinside.com 2019 - 2024. All rights reserved.