参考网址
http://9766553.blog.51cto.com/9756553/1693532
http://www.bubuko.com/infodetail-1089238.html
1
最近一直在用bootstrap做页面,个人感觉简约大气很好用,今天用插件chosen时发现不能选中值,调试了很长时间,查看源文件js等各种方法,最后终于解决:献上代码:
spacer.gifwKiom1XxV4KA8E9JAADEqxKlGaI497.jpg
无论样式还是自动匹配功能还是比较好的:
不能清除选中
解决方法:
$("#id").val("");
$("#id").trigger("chosen:updated");
设置选中的值
$("#id").val("选中的值");
$("#id").trigger("chosen:updated");
设置选中的文本
$("#id").text("选中的值");
$("#id").trigger("chosen:updated");
总而言之,每次设置时都要触发更新这个选择事件。
*监听的选择改变事件:
$("#id").chosen().change(function(){
//do something...
});
*设置多选
$("#id").attr("multiple",true);
*设置未找到时的显示文字
$("#id").chosen({
no_results_text : "未找到此选项!",
width:"70%"
});
分享到:
相关推荐
总结一下,jQuery Chosen插件虽然在某些功能上有所限制,但通过理解其内部工作原理,我们可以利用`destroy`方法来动态更新和设置值。在处理省市联动或者类似需要动态更新选择框内容的场景时,可以按照上述方法进行...
"2014-09-10 更新到最新选择和角度并添加清除选择的能力"则意味着项目保持了对最新版本的Chosen和AngularJS的支持,并且增加了清除选择的选项,用户可以方便地清空已选的值。 集成Chosen插件的基本步骤包括以下几点...
一个典型的多选下拉框由`<select>`标签定义,`<option>`标签用于添加可选项,且`<select>`标签的`multiple`属性设置为`true`,以启用多选模式: ```html <select id="mySelect" multiple> 选项1 选项2 选项3 <!...
// 输出选中的值 }); ``` 7. **异步数据加载**:结合Ajax,可以实现在用户输入时动态从服务器获取数据并填充到下拉菜单。 ```javascript var input = document.getElementById('searchInput'); input....
标题提到的"jquery select列表选择框选中美化效果特效代码"正是关于如何利用jQuery来增强`<select>`元素的视觉表现,使其更具吸引力和用户体验。 jQuery Select美化主要涉及以下几个方面: 1. **样式覆盖**:默认...
可以使用原生的HTML5 `<datalist>` 或者第三方库如Select2、Chosen等进行美化和适配。 8. **错误处理**:考虑到网络延迟或异常情况,需要添加适当的错误处理机制,如超时重试、异常提示等。 综上所述,"省市县三级...
它首先检查目标`select`是否已经有选项,如果有且第一个选项的值为"temp",则清空该列表。接着,遍历源`select`的选项,对每个被选中的选项执行以下操作: 1. 如果选项值为"temp",则弹出警告并返回。 2. 创建一个新...
$(".chzn-select").chosen(); ``` 2. 动态数据绑定: 通常情况下,Select元素绑定的数据是静态的或者预先定义的。而在本文中,我们关注的是如何实现动态绑定,即根据用户的操作实时从服务器获取数据并更新下拉框的...
首先,我们需要设置两个`<select>`元素,分别代表省份和城市: ```html <select id="province"> <!-- 省份选项 --> </select> <select id="city"> <!-- 城市选项 --> </select> ``` ### 3. 数据准备 为了实现...