在使用select2之前，也需要先連結cdn，以下就是需要連結的程式碼

<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

連結完畢後，就可以使用select2啦~
再來我們就透過select2來做下拉式選單

下拉式選單
如何做一個下拉式選單呢?
首先，先寫一段html，如下

<select class="select" name="states[]" multiple="multiple" style="width: 25%;">
    <option>first</option>
    <option>second</option>
    <option>third</option>
</select>

再來就是js的部分啦

 $(document).ready(function() {
    $('.select').select2({
        placeholder: '選擇一個選項',
        tags: true,
        tokenSeparators: [',', ' ']
    });    
  });

.select就是我前面select設定的class，
再來placeholder就是在我還沒點選任何下拉式選單的選項時，出現在下拉列表中的提示訊息

tags:true就是呈現標籤的形式，這也是我最後主要想呈現的部分

最後的結果就會像這樣
其實select2還有其他很多不一樣的呈現樣式，大家也可以去試試。
那今天就先到這啦~~