动态添加SELECT标签中的元素，数据项与option数据源不一致

最新推荐文章于 2024-07-20 20:11:36 发布

chris_sen

最新推荐文章于 2024-07-20 20:11:36 发布

阅读量2.4k

点赞数

分类专栏： JQuery 文章标签： JQuery SELECT

本文链接：https://blog.csdn.net/chris_sen/article/details/72457534

版权

本文介绍了在动态添加SELECT标签元素时，遇到数据项与option数据源不一致的情况。针对这种情况，文章提供了修改列表中某项数据，特别是包含下拉选项的数据时的解决方案。使用JQuery实现界面赋值，并在提交时通过隐藏域保存下拉选项的text值。同时，文章还简要讲解了如何添加和删除select的option项。

摘要由CSDN通过智能技术生成

案例描述：修改列表中的某一项数据，其中一列是下拉选项，下拉选项中的数据源areaList是系统配置的，但是数据中有些迁移数据，该列中的值不在数据源范围内。修改时，该下拉选项显示正确的信息，并可以修改。

修改时界面赋值代码如下：

  function setEditValue(......,city_area) {
    ......
  
	if(city_area =="xxx"){
		$("#cityAreaSelect option[value='0']").remove();
		
		var option = "<option value='0'>" + city_area + "</option>";
		$("#cityAreaSelect").prepend(option);   
		$("#cityAreaSelect option[value='0']").attr("selected", "selected");
	}else{
		  $("#cityAreaSelect option").each(
		    		function(index,item){
		    			 $(item).removeAttr("selected");
		                 if ($(item).val() == city_area) {
		                     $(item).attr("selected", "selected");	
		                 }
		    		});
	}