jquery chosen这个插件 可以实现 拼音搜索

https://github.com/emtiantian/ProblemLog

git地址

说明一下 js源码在../js/chonseOne.js
发现一个错误 在搜索单个汉字的时候搜索不到
已经修复 源码更新
发现 不能全拼搜索
已经修复
现有问题 在全拼搜索后 不能正确显示对应搜索内容 比如 好看 搜索 kan 不能正确的在‘看’字下面添加下划线
暂时去掉这个 下划线功能了 如有需要在改

Jquery chosen动态设置值

Jquery chosen 地址:https://github.com/harvesthq/chosen

一款选择插件,支持检索,多选,但不支持输入效果如下图



确定是用的这个哦, 不然可往下看也没有什么意义了

突然发现如果用在省市选择发现有如下问题:

1,不能动态设置值

2,不能动态设置选中

看了好几遍API愣是米有发现有方法可以直接调用。没办法就看源码,发现在其初始化的时候有一个判断如下图:


发现有个destroy是不是("#city).chosen("destroy");就可以了呢。把猜想试了一下果然可以。在这之前调试过其生成的dom想通过直接将其生成的dom移除掉,结果是不可行的,能移除掉,但是就再也无法初始化了。浪费了二三个小时哇。

首先解决第一个问题

[javascript] view plain copy
  1. <span style="white-space:pre">  </span>$("#province").change(function(){  
  2.         $("#city").html("");  
  3.         $("#city").chosen("destroy");  
  4.         $("<option value='-1'>-全部-</option>").appendTo("#city");  
  5.         $.getJSON("${ctx}/api/getCityByProvinceJson.jsp",{  
  6.             province:$("#province").val()  
  7.         },function(data){  
  8.               
  9.             $.each(data,function(i){  
  10.                 $("<option value='"+data[i].city+"'>"+data[i].city+"</option>").appendTo("#city");  
  11.             });  
  12.             $("#city").attr("multiple",true);  
  13.               
  14.             $("#city").chosen({  
  15.                 no_results_text : "未找到此选项!",  
  16.                 width:"70%"  
  17.             });  
  18.         });  
  19.     });  
  20.     $("#city").chosen({  
  21.         no_results_text : "未找到此选项!",  
  22.         width:"70%"  
  23.     });  

这样便可动态设置值了,感觉代码有点重复,但是目前还没有找到比较好的方法

下面解决第二个问题

用法跟上面相似,先给select设置值再用初始化下拉框,代码如下:

[javascript] view plain copy
  1. <span style="white-space:pre">  </span>$("#city").val("上海");  
  2.     $("#city").chosen({  
  3.         no_results_text : "未找到此选项!",  
  4.         width:"70%"  
  5.     });  


这样便可以动态设置选中了



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值