table中出现尖括号(<>), 后台接收到的为空

场景: 在使用sql建模的时候, 需要用户输入计算方法(可以是select查询,也可以是function等等),然后展示在表格中,待多条记录全部提交后, 就再将table中的数据全部提交给后台,后台在textarea中输入带有尖括号或者单双引号的时候, 页面会报错,解决 了报错后, 提交到后台的参数,在浏览器中是可以看到的, 但是后台接收到的却是空的。

 

 

 点击编辑出现的界面

 

 

 

 

解决办法: 

1、在展示到页面的时候:将尖括号和单双引号转化为&lt;  &gt;等

错误如下: 

 

 

 

转化的代码如下:

function toTxt(str) {  
	if (!str) return "";
	var RexStr = /\<|\>|\"|\'/g;
    str = str.replace(RexStr,  
		function (MatchStr) {  
			switch (MatchStr) { 
				
                case "<":  
                    return "<";  
                case ">":  
                    return ">";  
                case "\"":  
                    return """;  
                case "'":  
                    return "'";  
		default:  
		   return MatchStr;	    
                    
            }  
        }  
    )  
    return str;  
} 

  此时在页面中展示的就是带有尖括号和单双引号的数据, 和用户输入的一致

 

2、此时展示是正常的, 然后解决将数据传给后台,但是后台接收到的是空的问题

此时要将尖括号转化为ASCII 字符, 

function escapeText(str) {
	if (!str) return "";
	var arrEntities={'lt':'<','gt':'>','nbsp':' ','#39':"'",'quot':'"'};
	return str.replace(/&(lt|gt|nbsp|#39|quot);/ig,function(all,t){
	  return arrEntities[t];
	});
}

 

function escapeTableData(jsonDatas) {
	var jsonData = JSON.parse(jsonDatas)
	for (var i = 0; i < jsonData.length; i++) {
		jsonData[i]["validMethod"] = encodeURIComponent(escapeText(jsonData[i]["validMethod"]))
		jsonData[i]["calMethod"] = encodeURIComponent(escapeText(jsonData[i]["calMethod"]))
	}
	console.log(jsonData)
	return jsonData
}

var tableData = $("#modelTable").bootstrapTable('getData');
console.log(tableData)
var modelTableAll = escapeTableData(JSON.stringify(tableData));
console.log(encodeURIComponent(JSON.stringify(modelTableAll))) //最终要传给后台的值

  一定要进行两次encodeURIComponent, 一次的话还是报错

 

 

posted @ 2020-04-02 18:33  甜甜宝宝  阅读(...)  评论(...编辑  收藏