博客

今天在拼接字符串时加入了onclick事件出发的函数需要传递参数对象，结果遇到了一系列问题，特此记录

我是想用ajax接收后台传递的json数据，在成功的回调函数里拼接字符串，然后替换文本。

第一次我是这样拼接的

success : function(data){   
                     	console.log(data);
                     	str = '';
                     	for(var i=0; i<data.length; i++){                    	
                     		str += '<li onclick = "informationPoint('+ data[i] +')">' + data[i].chgstationName + '</li>';
                     	}
                     	$("#informationPoint").html(str);
                     }

结果浏览器报错如下：

出现这种情况我觉得是因为浏览器并不能成功解析我传入的json对象，故我又将json对象转换为了json字符串进行拼接

success : function(data){   
                     	console.log(data);
                     	str = '';
                     	for(var i=0; i<data.length; i++){
                     		var info = JSON.stringify(data[i]);                     	
                     		str += '<li onclick = "informationPoint('+info+')">' + data[i].chgstationName + '</li>';
                     	}
                     	$("#informationPoint").html(str);
                     }

结果浏览器又报如下错误：

但是onclick中的方法的参数取到了

所以这次出错是因为我拼接字符串用到的双引号和json字符串中的双引号冲突了，修改后代码如下

success : function(data){   
                     	console.log(data);
                     	str = '';
                     	for(var i=0; i<data.length; i++){
                     		var info = JSON.stringify(data[i]);                     	
                     		str += '<li onclick = "informationPoint('+info.replace(/"/g, '&quot;')+')">' + data[i].chgstationName + '</li>';
                     	}
                     	$("#informationPoint").html(str);
                     }

将json字符串中的双引号用转义字符来代替，问题就解决了