jquery的插件选择chosen的使用
版权声明:本文为博主原创文章,未经博主允许不得转载。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的使用的更多相关文章
- 利用jquery mobiscroll插件选择日期、select、treeList的具体运用
体验更优排版请移步原文:http://blog.kwin.wang/programming/jquery-mobiscroll-select-treeList.html mobiscroll是个很好用 ...
- FancySelect – 更好用的 jQuery 下拉选择框插件
FancySelect 这款插件是 Web 开发中下拉框功能的一个更好的选择.FancySelect 使用方便,只要绑定页面上的任何 Select 元素,并调用就 .fancySelect() 就可以 ...
- 基于jquery的城市选择插件
城市选择插件的难度不是很大,主要是对dom节点的操作.而我写的这个插件相对功能比较简答,没有加入省市联动. 上代码好了,参照代码的注释应该比较好理解. /* *基于jquery的城市选择插件 *aut ...
- ui-choose|列表选择jQuery美化插件
ui-choose是一款基于jQuery的列表选择美化插件.ui-choose可用于选项不太多的select.radio.checkbox等,提升用户体验. 使用方法 使用ui-choose列表美化插 ...
- 为jQuery写插件
很多场合,我们都会调用jQuery的插件去完成某个功能,比如slider. 如下图,做一个div,通过“$( "#slider" ).slider();”的方式直接将div变成sl ...
- jQuery常用插件
jQuery UI插件简介: jQuery UI是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库.包含底层用户交互.动画.特效和可更换主题的可视控件.我们可以直接用它来构建具 ...
- Jquery相册插件(开源下载)
一,导言 上次 “不定义JQuery插件,不要说会JQuery” 的博客写的肤浅,漏洞百出,而且最重要的是从理论上说如何定义一个jQuery插件,没有实质性的写一个jQuery插件出来,这未免是纸上谈 ...
- S Gallery – 很有特色的响应式 jQuery 相册插件
S Gallery 是一款响应式的 jQuery 相册插件.使用了 HTML5 全屏 API 以及 CSS3 动画 和 CSS3 转换,所以只能在支持这些功能的浏览器中使用. 这款插件它有一个特色功能 ...
- Select-or-Die:灵活的 jQuery 下拉列表插件
Select-or-Die 是一个 jQuery 插件,用来自定义下拉列表(Select)元素.原生的下拉选择元素在各个浏览器的默认样式差异很多,而且自定义样式很困难,因此 Web 开发人员喜欢使用插 ...
随机推荐
- LeNet5
Lecun Y, Bottou L, Bengio Y, et al. Gradient-based learning applied to document recognition[J]. Proc ...
- python基础知识——包
包是一种通过使用“模块名”来组织python模块的名称空间的方式. 无论是import形式还是from...import形式,凡是在导入语句中(不是在使用时)遇到带点的,就需要意识到——这是包. 包是 ...
- Linux常用的指令(...编辑文件+保存)
mkdir命令用来创建目录 1 mkdir filename touch命令有两个功能:一是用于把已存在文件的时间标签更新为系统当前的时间(默认方式),它们的数据将原封不动地保留下来:二是用来创建新的 ...
- python3 多线程编程
python / 并发 / 线程 / 对象 / 编程 0.什么是线程 1. 多线程模块 2. 创建线程的方法 3. join()方法 4.isAlive()方法 5. name属性和daemon属 ...
- pyhton3 random模块
random是内建(built-in)函数,作用是产生随机数 导入模块: import random 接着就可以调用random模块下的函数了使用 dir(random)可以查看random模块下有哪 ...
- Django 之基础续
1.路由系统之动态路由 前言:还记得之前的分页效果,这个如何实现呢?答案就是动态路由. url(r'^detail/(\d+)/$', views.detail), url(r'^detail2/(\ ...
- 每天一个Linux命令(43)at命令
at命令用于在指定时间执行命令.at允许使用一套相当复杂的指定时间的方法.可以用相对时间法指定,也可以用绝对时间法指定. (1)用法: 用法: at [选项参数] [时间 ...
- springboot-项目属性配置
springboot如何新建一个项目参考博客:https://www.cnblogs.com/junyang/p/8151802.html 在springboot默认生成的配置文件的格式是:appli ...
- linux性能调分析及调优
转:https://blog.csdn.net/luokehua789789/article/details/53007456 Linux 性能分析以及调优介绍 写在前面:计算机要解决的基本问题之一是 ...
- p2p网络中的NAT穿透技术----常见NAT穿越解决方案
转:http://blog.csdn.net/cllzw/article/details/46438257 常见NA丁穿越解决方案 NAT技术在缓解IPv4地址紧缺问题.构建防火墙.保证网络安全等方面 ...