js + php 处理 永远的敌人 特殊符号 1 在网页上的显示问题
php传值给js，然后js将数据显示在网页上，如果存在特殊字符如：' 半角单引号，" 半角双引号，或者和html实体符号相关的 & 就会出现各种显示上的问题
php部分先将这些特殊的字符转义
<?php
function arrayRecursive(&$array){
foreach ($array as $key => $value) {
if (is_array($value)) {
arrayRecursive($array[$key]);//如果是数组就进行递归操作
} else {
if(is_string($value)){
$temp1= addslashes($value);
$array[$key]= urlencode($temp1);//如果是字符串就urlencode
}else{
$array[$key] = $value;
}
}
}
}
function JSON($result) {
$array=$result;
arrayRecursive($array);//先将类型为字符串的数据进行 urlencode
$json = json_encode($array);//再将数组转成JSON
return urldecode($json);//最后将JSON字符串进行urldecode
}
$data = '"+123+'."'+&+"+<span class=\"new\">+&123";
// $data = '<script>var a=1;</script>';
$arr_data = Array(
'data' => Array(
'1'=>$data,
'2'=>$data,
'3'=> Array(
'123'=>'123',
'123'=>'123',
'123'=>'123'
)
)
);
function arrayRecursive2(&$array){
$search = array (
"'&'i",//转换and符号
"'\"'i",//转换半角双引号
"'\''i",//转换半角单引号
"'<'i",//转换小于号
"'>'i"//转换大于号
);
$replace = array (
"&",
""",
"'",
"<",
">"
);
foreach ($array as $key => $value) {
if (is_array($value)) {
arrayRecursive2($array[$key]);//如果是数组就进行递归操作
} else {
if(is_string($value)){
$array[$key] = preg_replace($search, $replace, $value);
}else{
$array[$key] = $value;
}
}
}
}
function replace_html_entity($result){
$origin = $result;
arrayRecursive2($origin);
return $origin;
}
$encode_array = replace_html_entity($arr_data);
echo JSON($encode_array);
?>
接着是js接受和html显示，以及div，span，input，textarea等相互转换显示的时候的问题：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<title>无标题文档</title>
</head>
<body>
<div id="J_div1"></div>
<span id="J_span1"></span>
<input type="text" id="J_input" value="" autocomplete="off" name="J_input" />
<textarea cols="60" rows="4" id="J_textarea" value="" autocomplete="off" name="J_textarea"></textarea>
<input type="hidden" id="J_hidden" value="" name="J_hidden" />
<div id="J_div3"></div>
<span id="J_span3"></span>
<input type="text" id="J_input2" value="" autocomplete="off" name="J_input2" />
<textarea cols="60" rows="4" id="J_textarea2" value="" autocomplete="off" name="J_textarea2"></textarea>
<input type="hidden" id="J_hidden2" value="" name="J_hidden2" />
</body>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
function change_to_html_entity(string){
string=string.replace(/&/g,"&");
string=string.replace(/"/g,""");
string=string.replace(/'/g,"'");
string=string.replace(/</g,"<");
string=string.replace(/>/g,">");
return string;
}
function change_to_origin(string){
string=string.replace(/"/g,'"');
string=string.replace(/'/g,"'");
string=string.replace(/</g,"<");
string=string.replace(/>/g,">");
string=string.replace(/&/g,"&");
return string;
}
var string1,string2;
var div_tpl = '<div id="J_div2">{word}</div>';
var span_tpl = '<span id="J_span2">{word}</span>';
$.ajax({
type: "POST",
url: "getdata3.php",
dataType:"JSON",
success:function(data){
string1 = data.data[1];
string2 = change_to_origin(string1);
$('#J_div1').html(string1);
$('#J_span1').html(string1);
$('#J_input').val(string2);
$('#J_textarea').val(string2);
$('#J_hidden').val(string2);
$('body').append(div_tpl.replace('{word}',string1));
$('body').append(span_tpl.replace('{word}',string1));
$('#J_div3').text($('#J_hidden').val());
$('#J_span3').text($('#J_hidden').val());
$('#J_input2').val($('#J_div3').text());
$('#J_textarea2').val($('#J_span3').text());
$('#J_hidden2').val($('#J_span3').text());
}
});
</script>
</html>
至于从这些div，span，input，textarea中取出，通过js传给php时候的问题，在后一篇文章中。。。