实现多选select下拉框--18.08.13菜鸟打怪升级

最新推荐文章于 2025-06-01 15:23:25 发布

原创最新推荐文章于 2025-06-01 15:23:25 发布 · 438 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种使用HTML和JavaScript实现带有搜索功能的多选下拉框的方法。通过结合HTML的`<select>`元素与jQuery插件`select2`，实现了自定义的多选框样式和功能，包括占位符提示和动态填充选项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML

 <div class="col-sm-8">
     <select id="@@" class="form-control" name="neo_channel_id" multiple="multiple">
         <%for (var i in ###) {%>
            <%if (copy_region_price[i].channel !== null) {%>
                <option value="<%= copy_region_price[i].channel%>">
                     <%=  ####  %>
                 </option>
               <%}%>
          <%}%>
      </select>
</div>

JS代码

  jQuery(document).ready(function ($) {
        $('#@@').select2({
            placeholder: "请选择如：##，###",
            createTag:function (decorated, params) {
                return null;
            },
        });
        $('#@@').select2({
            placeholder: "请选择如：###",
            createTag:function (decorated, params) {
                return null;
            },
        });
        ......
        .....
        ......
        };

这里写图片描述