Jquerychosen动态设置值实例介绍
实例 设置 介绍 动态
2023-06-13 09:15:04 时间
Jquerychosen地址:https://github.com/harvesthq/chosen
一款选择插件,支持检索,多选,但不支持输入效果如下图
确定是用的这个哦,不然可往下看也没有什么意义了
突然发现如果用在省市选择发现有如下问题:
1,不能动态设置值
2,不能动态设置选中
看了好几遍API愣是米有发现有方法可以直接调用。没办法就看源码,发现在其初始化的时候有一个判断如下图:
发现有个destroy是不是("#city).chosen("destroy");就可以了呢。把猜想试了一下果然可以。在这之前调试过其生成的dom想通过直接将其生成的dom移除掉,结果是不可行的,能移除掉,但是就再也无法初始化了。浪费了二三个小时哇。
首先解决第一个问题
复制代码代码如下:
一款选择插件,支持检索,多选,但不支持输入效果如下图
确定是用的这个哦,不然可往下看也没有什么意义了
突然发现如果用在省市选择发现有如下问题:
1,不能动态设置值
2,不能动态设置选中
看了好几遍API愣是米有发现有方法可以直接调用。没办法就看源码,发现在其初始化的时候有一个判断如下图:
发现有个destroy是不是("#city).chosen("destroy");就可以了呢。把猜想试了一下果然可以。在这之前调试过其生成的dom想通过直接将其生成的dom移除掉,结果是不可行的,能移除掉,但是就再也无法初始化了。浪费了二三个小时哇。
首先解决第一个问题
<SPANstyle="WHITE-SPACE:pre"></SPAN>$("#province").change(function(){
$("#city").html("");
$("#city").chosen("destroy");
$("<optionvalue="-1">-全部-</option>").appendTo("#city");
$.getJSON("${ctx}/api/getCityByProvinceJson.jsp",{
province:$("#province").val()
},function(data){
$.each(data,function(i){
$("<optionvalue=""+data[i].city+"">"+data[i].city+"</option>").appendTo("#city");
});
$("#city").attr("multiple",true);
$("#city").chosen({
no_results_text:"未找到此选项!",
width:"70%"
});
});
});
$("#city").chosen({
no_results_text:"未找到此选项!",
width:"70%"
});
这样便可动态设置值了,感觉代码有点重复,但是目前还没有找到比较好的方法
下面解决第二个问题
用法跟上面相似,先给select设置值再用初始化下拉框,代码如下:
<SPANstyle="WHITE-SPACE:pre"></SPAN>$("#city").val("上海");
$("#city").chosen({
no_results_text:"未找到此选项!",
width:"70%"
});
这样便可以动态设置选中了
相关文章
- java jsonarray string,java json字符串转JSONObject和JSONArray以及取值的实例「建议收藏」
- QtCreator设置多实例运行
- 【Android 逆向】使用 Python 解析 ELF 文件 ( Capstone 反汇编 ELF 文件中的机器码数据 | 创建反汇编解析器实例对象 | 设置汇编解析器显示细节 )
- SQL中from_unixtime函数的使用方法实例
- spring原理案例-基本项目搭建 03 创建工程运行测试 spring ioc原理实例示例详解编程语言
- Oracle:获取当前实例的名称(oracle当前实例名)
- MySQL多实例解决方案不同版本间共存,实现数据隔离和灵活部署(mysql不同版本多实例)
- 单独使用Redis即可实现简单的高并发(单实例的redis)
- 实例使用Redis实现多个监控实例(redis设置多个监控)
- asp.net运行提示未将对象引用设置到对象的实例错误解决方法
- 一款jquery特效编写的大度宽屏焦点图切换特效的实例代码
- jquery设置元素相对于另一个元素的top值(实例代码)
- phpZipArchive压缩函数详解实例
- Jjcarousellite实现图片列表滚动的简单实例
- PHPgoto语句简介和使用实例
- jquery的ajax异步请求接收返回json数据实例
- ASP.NET数据库缓存依赖实例分析
- DevExpress之饼状图突出(Explode)设置实例
- php之curl设置超时实例
- JQuery设置时间段下拉选择实例
- html的DOM中document对象forms集合用法实例
- C语言实现图的遍历之深度优先搜索实例