js:有关TypeError: invalid 'in' operand obj的错误

最新推荐文章于 2024-02-11 02:30:00 发布

初露寒秋

最新推荐文章于 2024-02-11 02:30:00 发布

阅读量8k

点赞数 1

分类专栏： js jquery html 文章标签： js有关TypeError invali js in操作 json字符串转换成json对象数组

本文链接：https://blog.youkuaiyun.com/mingliangniwo/article/details/48655027

版权

js jquery html 专栏收录该内容

15 篇文章

订阅专栏

<!doctype html>
<html lang="en">
<script type="text/javascript">
$.ajax({  
	url:sysPath+'/controller/getDelivery.mmx?popId='+value,      
	type:'post',  
	success:function(data){  
		console.log(data);(1)//输出结果：[{"id":1,"name":"韵达"},{"id":2,"name":"圆通"},{"id":3,"name":"申通"}]  
		$('#delivery').html("");  
		//var returnData = $.parseJSON(data);(2)//将字符串转换成对象</span>  
		var returnData = eval(data);(3)//将字符串转换成对象
		console.log(returnData);(4)//输出结果：[Object { id=1,  name="韵达"}, Object { id=2,  name="圆通"}, Object { id=3,  name="申通"}]  
		$.each(returnData, function(i, obj){  
		$('#delivery').append('<option value='+obj.id+'>'+obj.name+'</option>');  
		});  
	}  
}); 
</script>
<body>
     <select name="delivery" id="delivery" style="width:100px">
	   <c:forEach items="${list}" var="bean">
	   <option value="${bean.id}"  ${bean.id == 1 ? "selected":""}>${bean.name}</option> 
     </select>
</body>
</html>

使用each解析时候，如果不加(2)、(3)句，就会报错TypeError: invalid 'in' operand obj。

原理可以看看这个：http://www.bennadel.com/blog/1918-Javascript-s-IN-Operator-Does-Not-Work-With-Strings.htm

下面说说(2)、(3)句的作用，(2)、(3)句的作用是一样的，两种实现方式而已，他们的作用是什么呢？

原因：由于在js中遍历时in操作支持instance of Object, Array, Date, Number, 但是对String是不支持的，同时url:sysPath+'/controller/getDelivery.mmx?popId='+value,返回的又是json类型的字符串(如："[{"id":1,"name":"韵达"},{"id":2,"name":"圆通"},{"id":3,"name":"申通"}]")，所以对字符串进行$.each()操作，就会报错。

解决办法：所以我们就要去字符串进行转换，转换成对象数组类型(如：[Object { id=1, name="韵达"}, Object { id=2, name="圆通"}, Object { id=3, name="申通"}])，而//var returnData = $.parseJSON(data);//将字符串转换成对象；(2) var returnData = eval(data);//将字符串转换成对象(3)，这两句代码正好可以将字符串转换成对象数组，达到我们的目的

后台代码：

@Controller
@RequestMapping("/controller")
public class controller {

	@RequestMapping("/getParamDelivery")
	@ResponseBody
	public List<voSelect> getParamDelivery(String param){
		List<voSelect> list = service.getParamDelivery(pop);
		return deliveryList;
	}
}

public List<voSelect> getParamDelivery(String param) {
		List<voSelect> list = new ArrayList<voSelect>();
		String sql = "select DISTINCT a.id,a.name from table1 a JOIN table2 b ON a.delivery_id=b.id  ";
		list = this.getJdbcTemplate().query(sql,new BeanPropertyRowMapper<voSelect>(voSelect.class));
		return list;
	}	

public class voSelect implements Serializable {
	private int id;
	private String name;
	
	public voSelect(){}
	
	public voSelect(int id, String name) {
		super();
		this.id = id;
		this.name = name;
	}

	public int getId() {
		return id;
	}
	
	public void setId(int id) {
		this.id = id;
	}
	
	public String getName() {
		return name;
	}
	
	public void setName(String name) {
		this.name = name;
	}
	
}