动态添加“<input onclick=“‘+json+‘“>“元素传参时不识别json的bug问题解决
作者:互联网
问题描述:
var json = {a:1};
在html中使用js方法动态添加
"<input οnclick="functiona(\''+json+\'')">"
元素时不识别json数据
问题分析:
json在传参时,json为json格式的数据,传入后调用onclick方法只会显示未识别.
var json2 = JSON.stringify(json);
将json2传入后调用会在遇到json2数据中的第一个双引号后戛然而止,因为动态添加的方法在传入json2字符串数据后会有双引号{“a”:1},会与
"<input οnclick="functiona(\''+json+\'')">"
中出现的双引号产生冲突
问题解决:
将json数据string化后再将双引号全部转化为\'反斜杠单引号再进行动态添加元素
var data2 = JSON.stringify(json).replace(/\"/g,"\\\'");
"<input οnclick="functiona(\''+json+\'')">"
导入的结果可以正常读取
function functiona(data){
//将反斜杠去掉再将单引号变成双引号
var list = data.replace(/\\/g,"").replace(/\'/g,"\"");
//将list转化为json格式的数据
var data2 = {"ids": id,"list":[JSON.parse(list)]};
//如果data2需要提交给后台的话需要将data2转换为string化的数据
//注意使用data2.toString()的结果为"[object Object]"
//只能使用JSON.stringify(data2)进行转string化
//ajax中的 dataType: "json",contentType: 'application/json;charset=UTF-8',
//springboot后台接收要加@RequestBody接收像这种Vo类型的数据,不加@RequestBody会报错
}
标签:双引号,list,json,传参时,json2,onclick,var,data2 来源: https://blog.csdn.net/weixin_43099837/article/details/115570607