select2插件的使用整理

最新推荐文章于 2025-11-16 04:18:21 发布

原创最新推荐文章于 2025-11-16 04:18:21 发布 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

jquery 专栏收录该内容

9 篇文章

订阅专栏

本文详细介绍如何使用Select2插件进行下拉框的定制，包括移除搜索框、获取选中值、控制下拉框状态及禁用下拉框等功能，为网页表单提供更佳的用户体验。

1、去除搜索框，此处需要注意的是：要在下拉框打开之前执行，否则不管用。

$("#projectId").select2({
          minimumResultsForSearch: -1, //去除搜索框
          placeholder:"---请选择---"  //设置默认提示值
  });

2、获得选中值及打开关闭时执行的内容

$("#projectId").select2("open");	//打开下拉菜单	
    $("#projectId").on("select2:select",function(e){ //选中的结果
       var ID = $("#projectId option:selected").text();//获取当前选中值
       $("#factoryId").text(ID);
       $("#projectId").select2("close");
    }).on("select2:close",function(){   //下拉菜单关闭时执行的内容
});

3、禁止下拉框使用

$("#projectId").prop("disabled", true);

false：可用

true：不可用