Jquery chosen动态设置值 select Ajax动态载入数据 设置chosen和获取他们选中的值

Posted zhchoutai

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Jquery chosen动态设置值 select Ajax动态载入数据 设置chosen和获取他们选中的值相关的知识,希望对你有一定的参考价值。


? 在做一个编辑对话框时,要对里面带有select option的操作。主要是想动态载入option和对option的选中。可是由于项目中使用了jquery里的chosen()方法。怎么也无法实现效果。原码例如以下:

?

?

Java代码 ?
  1. <select?id="viewOLanguage"?data-rel="chosen">??
  2. ????<option?value="zh">中文简体(中文简体?Chinese)</option>??
  3. ????<option?value="en">English(英语?English)</option>??
  4. ????<option?value="fr">fran?ais(法语?French)</option>??
  5. ????<option?value="de">Deutsch(德语?German)</option>??
  6. ????<option?value="it">italiano(意大利语?Italian)</option>??
  7. ????<option?value="es">espa?ol(西班牙语?Spanish)</option>??
  8. ????<option?value="ru">русский(俄语?Russian)</option>??
  9. ????<option?value="ja">日本語(日语?Japanese)</option>??
  10. ????<option?value="ko">???(韩语?Korean)</option>??
  11. </select>??
  12. ??
  13. ??
  14. <select?id="tLanguage"?multiple="multiple"?data-rel="chosen"?style="width:?80%"?>??
  15. ????<option?value="zh">中文简体(中文简体?Chinese)</option>??
  16. ????<option?value="en">English(英语?English)</option>??
  17. ????<option?value="fr">fran?ais(法语?French)</option>??
  18. ????<option?value="de">Deutsch(德语?German)</option>??
  19. ????<option?value="it">italiano(意大利语?Italian)</option>??
  20. ????<option?value="es">espa?ol(西班牙语?Spanish)</option>??
  21. ????<option?value="ru">русский(俄语?Russian)</option>??
  22. ????<option?value="ja">日本語(日语?Japanese)</option>??
  23. ????<option?value="ko">???(韩语?Korean)</option>??
  24. </select>??

?

在引用的js文件里使用了这种代码:

?

Js代码 ?
  1. //chosen?-?improves?select??
  2. $(‘[data-rel="chosen"],[rel="chosen"]‘).chosen();??

?

然后在自己的私有js文件里怎么对select进行不论什么操作都没有效果:

?

Js代码 ?
  1. //??$("#viewTLanguage?option:?selected").attr("value",?language);??
  2. ????$("#viewTLanguage?option[value=‘"+language+"‘]").attr("selected","selected");??
  3. ??
  4. ?????????jquery.append(option);??

?

于是在网上寻找一些解决的方法。偶然看了几篇文章,顿时好像明确一点什么。

事实上全然能够在使用jquery的chosen()方法前进行操作,然后再进行chosen的方法。

?

Js代码 ?
  1. $("#viewOLanguage?option[value=‘"+oLanguage+"‘]").attr("selected","selected");??
  2. $("#viewOLanguage").chosen();??

?

而且在select中去掉“data-rel="chosen"”,这样一来。就能实现select对应项的选中了,相同,append方法也会效果。

?

在网上另一种说法是使用$("#jquery").chonse("destroy"),我也试了下。只是没有成功。

?

另外还能够试试这个:

?

?

Js代码 ?
  1. jQuery?Chosen.destroy().init()??

?

又一次实例化的方法。

?

?ps:这篇文章之前有不完好的地方。所说的解决的方法仅仅攻克了初始问题,却没有考虑到兴许载入的事情。

所以 ,还须要用这段代码:

?

Js代码 ?
  1. $("#dialogOLanguage").trigger("liszt:updated"); ?//项目中能够使用

?或者是新版本号的中的

?

Js代码 ?
  1. $("#dialogOLanguage").trigger("chosen:updated"); ?//可能是由于仅仅能在新版本号中使用的原因,项目中没效果

?

这样能够解决同一select不断动态载入的问题。

?

另。destroy的方法还是没有实验成功。

?


以上是关于Jquery chosen动态设置值 select Ajax动态载入数据 设置chosen和获取他们选中的值的主要内容,如果未能解决你的问题,请参考以下文章

jQuery Chosen 使用

jQuery Chosen - 获取(多个)选定的标签(不是值)

解决chosen-select动态加载数据不生效的问题

jQuery Validate 无法验证 chosen-select元素

Jquery select chosen 插件注意点

jQuery Chosen 插件动态添加选项