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

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

 

 

<select id="viewOLanguage" data-rel="chosen">
	<option value="zh">简体中文(简体中文 Chinese)</option>
	<option value="en">English(英语 English)</option>
	<option value="fr">français(法语 French)</option>
	<option value="de">Deutsch(德语 German)</option>
	<option value="it">italiano(意大利语 Italian)</option>
	<option value="es">español(西班牙语 Spanish)</option>
	<option value="ru">русский(俄语 Russian)</option>
	<option value="ja">日本語(日语 Japanese)</option>
	<option value="ko">한국어(韩语 Korean)</option>
</select>


<select id="tLanguage" multiple="multiple" data-rel="chosen" style="width: 80%" >
	<option value="zh">简体中文(简体中文 Chinese)</option>
	<option value="en">English(英语 English)</option>
	<option value="fr">français(法语 French)</option>
	<option value="de">Deutsch(德语 German)</option>
	<option value="it">italiano(意大利语 Italian)</option>
	<option value="es">español(西班牙语 Spanish)</option>
	<option value="ru">русский(俄语 Russian)</option>
	<option value="ja">日本語(日语 Japanese)</option>
	<option value="ko">한국어(韩语 Korean)</option>
</select>

 

在引用的js文件中使用了这样的代码：

 

//chosen - improves select
$('[data-rel="chosen"],[rel="chosen"]').chosen();

 

然后在自己的私有js文件中怎么对select进行任何操作都没有效果：

 

//	$("#viewTLanguage option: selected").attr("value", language);
	$("#viewTLanguage option[value='"+language+"']").attr("selected","selected");

         jquery.append(option);

 

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

其实完全可以在使用jquery的chosen()方法前进行操作，然后再进行chosen的方法。

 

$("#viewOLanguage option[value='"+oLanguage+"']").attr("selected","selected");
$("#viewOLanguage").chosen();

 

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

 

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

 

另外还可以试试这个：

 

 

jQuery Chosen.destroy().init()

 

重新实例化的方法。

 

 ps:这篇文章之前有不完善的地方，所说的解决办法只解决了初始问题，却没有考虑到后续加载的事情。所以 ，还需要用这段代码：

 

$("#dialogOLanguage").trigger("liszt:updated");

 或者是新版本的中的

 

$("#dialogOLanguage").trigger("chosen:updated");

 

这样可以解决同一select不断动态加载的问题。

 

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

 

评论

2 楼 lyyltt 2016-03-10  

你好 请问一下 jQuery Chosen  表单页有两个动态select时  表单验证失败后 填写的数据会被清空 ，如增加一个用户 给他关联的部门和权限角色是动态的列表，当前表单页的手机号不合法 弹出提示空 整个页面填写的数据被清空  但是去掉其中任一个select  他就没有问题

1 楼 qq171264 2016-01-26  

感谢分享，看了你的文章，问题解决了