版权声明:本文为博主原创文章,未经博主允许不得转载。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. 07_Warning $HADOOP_HOME is deprecated.去除办法

    Warning $HADOOP_HOME is deprecated.去除办法 警告的出现: 解决方案: 第一种: 去除[/etc/profile]文件中[export HADOOP_HOME=/op ...

  2. grads 读取shp

    自从GrADS2.0.a8版本开始,GrADS引入了对shp图形的支持,关于此格式在这里不多说, 于是今晚就简单测试了一下最简单画图和查询命令(后续还将测试输出shp图形的命令)    测试数据采用的 ...

  3. linux 定时任务未执行php脚本

    1,对于无法执行php文件,首先你应该考虑的问题是是否php代码有错误,你可以先检查一下你的php代码,或者可以在linux上面执行一下这个文件,看是否能够执行成功:如果成功了,就说明是crontab ...

  4. 【Head First Servlets and JSP】笔记15:建立一个JSP页面来显示被访问了多少次

    1.这是一个非常简单的程序,它看起来是这个样子的: 实际功能就是,每访问该页面一次count数加1,在服务器重启前(JVM重启前),这个次数将持续累加. 2.因为这个程序过于简单,所以我希望可以通过H ...

  5. CSS3带小图标垂直下拉菜单

    在线演示 本地下载

  6. jQuery自动轮播图片焦点图

    在线演示 本地下载

  7. 克隆VMware虚拟机

    虚拟机使用过程需要用到多个进行实验.重新安装时间又太长,通过vmware虚拟机自带软件能够很好的快速克隆出完全相同的系统. 环境:关闭VMware,不要在开启状态哦~ 步骤: 选中需要被克隆的系统 菜 ...

  8. eclipse maven 项目 maven build 无反应

    eclipse maven 项目 使用maven build ,clean 等命令均无反应,控制台无任何输出 1.打开Window --> Preferences --> Java --& ...

  9. 有些 where 条件会导致索引无效

    在查询中,WHERE 条件也是一个比较重要的因素,尽量少并且是合理的 where条件是徆重要的,尽量在多个条件的时候,把会提取尽量少数据量的条件放在前面,减少后一个 where 条件的查询时间.有些 ...

  10. sqoop1.4.6 全量导入与增量导入 与使用技巧

    全量导入: sqoop import --connect jdbc:mysql://192.168.0.144:3306/db_blog --username root --password 1234 ...