首先要引用

因为肯定要引用jq,所以就没有写啦

<link rel="stylesheet" href="__ROOT__/Public/jschy/chosen_v1.8.7/chosen.min.css">
<script src="__ROOT__/Public/jschy/chosen_v1.8.7/chosen.jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="__ROOT__/Public/jschy/chosen_v1.8.7/chosen.jquery.js"></script>

然后 是 主体 select

<select id="keylist" data-placeholder="Choose a Country..." multiple class="my-chosen-select">
<option value="1">United States</option>
<option value="2">United Kingdom</option> </select> class 是主要的.js是根据这个class="my-chosen-select" 来找到这个元素
multiple  代表可以多选
初始化
//初始化插件 chosen
$(".my-chosen-select").chosen({
width: "100%", //宽度
search_contains:true//模糊搜索开启
});
.my-chosen-select就是之前class设置的
初始化放到最后面就行

选中多个

$("#keylist option[value='2']").attr("selected",true);
$("#keylist").trigger("chosen:updated");//更新
keylist 是select 的id ;
需要更新才能生效

获取 选中的值

$("#keylist").val()
keylist是select 的id

select chosen 的入门使用的更多相关文章

  1. Jquery select chosen 插件注意点

    <select style="width:200px;" name="carId" data-placeholder="选择车辆牌照" ...

  2. select chosen 禁用下拉框某一个option

    $("#tbParBudCode option[value='" + budCodeId + "']").attr("disabled", ...

  3. jquery select chosen禁用某一项option

    $("#tbParBudCode").chosen().change(function () { $("#tbParBudCode option[value='" ...

  4. jquery select chosen 动态绑定值

    $("#ddlMstData").find("option[value=" + data.MstKey + "]").attr(" ...

  5. 下拉框select chosen被遮盖

    最简单的就是让容器高度大点. 用js调整也行. 为什么z-index不管事,看下面... 浏览器支持 所有主流浏览器都支持 z-index 属性. 注释:任何的版本的 Internet Explore ...

  6. chosen组件实现下拉框

    chosen组件用于增强原生的select控件,使之有更好的用户体验.官方demo https://harvesthq.github.io/chosen/ 目前项目中碰到的使用,比如一个页面中有两个不 ...

  7. jquery plugins —— Chosen

    官网地址:http://harvesthq.github.io/chosen/ Chosen (v1.4.2) Chosen has a number of options and attribute ...

  8. chosen下拉框插件的使用

    效果如下 第一步: 第二步: 根据HTML5规范, 通常在引入CSS和JS时不需要指明 type,因为 text/css 和 text/javascript 分别是他们的默认值. <link r ...

  9. JQueryUI Chosen插件

    github地址:https://harvesthq.github.io/chosen/#change-update-events Using Chosen is easy as can be. Do ...

随机推荐

  1. java mutilThread

    可以参考https://www.cnblogs.com/wxd0108/p/5479442.html 这里补充一下我理解多线程这部分的一些要点. 1.首先是java的monitor概念:https:/ ...

  2. cocoa 线程操作

    在Cocoa 中创建线程使用NSThread类的detachNewThreadSelector: toTarget:withObject:方法 NSPort *port1 = [NSPort port ...

  3. python's fourth day for me 列表

    break 可以打断 for 循环不执行 else 语句 s = 'fdddsadwes' for i in s: if i == 's': break #可跳出for循环且不用执行else语句 pr ...

  4. java事件监听机制2

    今天早上的两点收获: 1.addActionListener(其中的setActionCommand函数就是要对对象进行唯一性的标记,便于消息传来后进行处理.理论上actionlistener可以全部 ...

  5. cpu,io密集型计算概念

    I/O密集型 (CPU-bound) I/O bound 指的是系统的CPU效能相对硬盘/内存的效能要好很多,此时,系统运作,大部分的状况是 CPU 在等 I/O (硬盘/内存) 的读/写,此时 CP ...

  6. oracle查询列合并为行(listagg简单用法)

    今天工作时遇见一个数据查询分组问题,就是将分组后同一组数据某一列合并为一行,因为之前很少用到,这次工作中刚好有用到,所以手痒难耐,将它记录下来. 查询sql如下: select t.province_ ...

  7. mac下怎样删除冗余的环境变量?echo $PATH

    记下$PATH变量中冗余路径所处顺序,例如: /Users/zhang/.rvm/gems/ruby-2.1.2/bin:/Users/zhang/.rvm/gems/ruby-2.1.2@globa ...

  8. copyWithZone详解

    [copyWithZone详解] NSObject实现了-copy.+copy.+copyWithZone方法.代码如下: + (id)copy { return (id)self; } + (id) ...

  9. 算法优化》关于1D*1D的DP的优化

    关于这一主题的DP问题的优化方法,我以前写过一篇博客与其有关,是关于对递推形DP的前缀和优化,那么这种优化方法就不再赘述了. 什么叫1D*1D的DP捏,就是一共有N种状态,而每种状态都要N种决策,这就 ...

  10. 【poj1679】The Unique MST

    [题目大意] 共T组数据,对于每组数据,给你一个n个点,m条边的图,设图的最小生成树为MST,次小生成树为ans,若MST=ans,输出Not Unique!,否则输出MST [题解] 很明确,先求M ...