版权声明:本文为博主原创文章,未经博主允许不得转载。http ://blog.csdn.net/jobschen/article/details/46619443

一,文件引入

jquery // jquery必须,且需要在chosen.js之前
chosen.jquery.min.js //压缩版的选择核心jquery代码
chosen.css //选择的样式文件

二,代码示例

1。html代码

<select  class="chosen-select" data-placeholder="Choose a Country..." multiple> </select>
  • 1

data-placeholder是将第一个选项留空时默认显示的内容。multiple 
表示可以多选
主要还是class =“chosen-select”

2。JS代码

$(".chosen-select").chosen({
no_results_text: "没有找到结果!",//搜索无结果时显示的提示
search_contains:true, //关键字模糊搜索,设置为false,则只从开头开始匹配
allow_single_deselect:true, //是否允许取消选择
max_selected_options:6 //当select为多选时,最多选择个数
});

3。事件

 a)更改事件:

$(".dept-select").chosen().change(function(){
//do something...
});

 b)当我们需要动态更新选择下的选择项时,只需在更新选择项后触发选择中的liszt:updated事件就可以了

//...$(".dept-select").html('...<option>部门6</option>...');
$(".dept-select").trigger("liszt:updated");

以上只是部分选择插件的使用,更多配置属性,尽请百度...

jquery的插件选择chosen的使用的更多相关文章

  1. 利用jquery mobiscroll插件选择日期、select、treeList的具体运用

    体验更优排版请移步原文:http://blog.kwin.wang/programming/jquery-mobiscroll-select-treeList.html mobiscroll是个很好用 ...

  2. FancySelect – 更好用的 jQuery 下拉选择框插件

    FancySelect 这款插件是 Web 开发中下拉框功能的一个更好的选择.FancySelect 使用方便,只要绑定页面上的任何 Select 元素,并调用就 .fancySelect() 就可以 ...

  3. 基于jquery的城市选择插件

    城市选择插件的难度不是很大,主要是对dom节点的操作.而我写的这个插件相对功能比较简答,没有加入省市联动. 上代码好了,参照代码的注释应该比较好理解. /* *基于jquery的城市选择插件 *aut ...

  4. ui-choose|列表选择jQuery美化插件

    ui-choose是一款基于jQuery的列表选择美化插件.ui-choose可用于选项不太多的select.radio.checkbox等,提升用户体验. 使用方法 使用ui-choose列表美化插 ...

  5. 为jQuery写插件

    很多场合,我们都会调用jQuery的插件去完成某个功能,比如slider. 如下图,做一个div,通过“$( "#slider" ).slider();”的方式直接将div变成sl ...

  6. jQuery常用插件

    jQuery UI插件简介: jQuery UI是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库.包含底层用户交互.动画.特效和可更换主题的可视控件.我们可以直接用它来构建具 ...

  7. Jquery相册插件(开源下载)

    一,导言 上次 “不定义JQuery插件,不要说会JQuery” 的博客写的肤浅,漏洞百出,而且最重要的是从理论上说如何定义一个jQuery插件,没有实质性的写一个jQuery插件出来,这未免是纸上谈 ...

  8. S Gallery – 很有特色的响应式 jQuery 相册插件

    S Gallery 是一款响应式的 jQuery 相册插件.使用了 HTML5 全屏 API 以及 CSS3 动画 和 CSS3 转换,所以只能在支持这些功能的浏览器中使用. 这款插件它有一个特色功能 ...

  9. Select-or-Die:灵活的 jQuery 下拉列表插件

    Select-or-Die 是一个 jQuery 插件,用来自定义下拉列表(Select)元素.原生的下拉选择元素在各个浏览器的默认样式差异很多,而且自定义样式很困难,因此 Web 开发人员喜欢使用插 ...

随机推荐

  1. 虚拟化qemu-img的简单用法。

    qemu-img 命​令​行​工​具​是​ Xen 和​ KVM 用​来​格​式​化​各​种​文​件​系​统​的​,可​使​用​ qemu-img 格​式​化​虚​拟​客​户​端​映​像​.​附​加​ ...

  2. CS224n学习资源汇总

    一.课程网站: http://web.stanford.edu/class/cs224n/archive/WWW_1617/index.html 二.视频(中文字幕) http://www.mooc. ...

  3. XSS - 禁止浏览器读取Cookie - HttpOnly

    1.什么是HttpOnly? 如果您在cookie中设置了HttpOnly属性,那么通过js脚本将无法读取到cookie信息,这样能有效的防止XSS攻击,具体一点的介绍请google进行搜索.   C ...

  4. MongoDB环境配置

    在官网上下载MongoDB可执行文件安装在电脑上后,想要运行需先安装路径下新建一个data文件夹,再在里面新建db文件夹用户存放数据库文件和相关配置. 在bin目录里面运行命令行: 这样MongoDB ...

  5. vi高级命令集锦

    .交换两个字符位置 xp .上下两行调换 ddp .把文件内容反转 :g/^/m0/ (未通过) .上下两行合并 J .删除所有行 dG .从当前位置删除到行尾 d$ .从当前位置复制到行尾 y$ 如 ...

  6. python:格式化输出 str.format()

    官网说明:https://docs.python.org/2/library/string.html#formatstrings python的格式输出有两种方法: 1.“ %s”.(variant) ...

  7. 三 ip dns等配置

    一IP.端口.协议基本概念 ip的简单概念 互联网上的计算机,都会有一个唯一的32位的地址,ip地址 我们访问服务器,就必须通过ip地址 局域网里也有预留的ip地址  192/10/172.居于王的i ...

  8. One 的使用(1)

    方法一:使用命令提示符 第一步:打开d盘  C:Users\dcf>d; 第二步:打开工作空间  D:\>Cd workspace 第三步:打开the one  D:\workspace& ...

  9. 【P2158】仪仗队&欧拉函数详解

    来一道数论题吧. 这个题一眼看上去思路明确,应该是数论,但是推导公式的时候却出了问题,根本看不出来有什么规律.看了马佬题解明白了这么个规律貌似叫做欧拉函数,于是就去百度学习了一下这东西. 欧拉函数的含 ...

  10. vijos 1250 最勇敢的机器人 分组背包+并查集

    P1250最勇敢的机器人 背景 Wind设计了很多机器人.但是它们都认为自己是最强的,于是,一场比赛开始了~ 描述 机器人们都想知道谁是最勇敢的,于是它们比赛搬运一些物品. 它们到了一个仓库,里面有n ...