JQuery Post转义提交HTML模板
最近遇到这样一个问题，在表单中有一个textarea文本框，用来保存HTML模板。
因为是HTML模板，所以会有<html>、<script>等标签，但是这样无法通过AJAXPost方式保存。
经过实验，<script是导致无法提交的根源。找到原因，解决办法就简单了，就是把<转义成HTML实体<。
最新说明：这个最后发现，是__POST被后台的PHP代码拦截了，所以不是客户端的问题，把PHP拦截代码去掉就可以了。
具体措施如下：
1HTML表单
Form表单如下：
<formaction="save.php"method="post"> <textareaname="source"></textarea> <buttontype="submit">提交</button> </form>
然后，在文本框中输入如下内容，
<!DOCTYPEhtml>
<html>
<head>
<title>演示</title>
<scripttype="text/javascript">
alert("弹出框");
</script>
</head>
<body>
<div>演示</div>
</body>
</html>
再提交。
2Post提交
JQueryPost提交代码如下：
$("form[method='post']").on('submit',function(e){
e.preventDefault();
varform=$(this);
$.post(
form.attr("action"),
form.serialize(),
function(result){
$('.alert').html(result.msg).show().delay(1500).fadeOut();
if(result.success){
setTimeout(function(){
window.location.href="index.php";
},1000);
}else{
returnfalse;
}
},
'json'
);
});
这样是无法提交的。
3转义函数
我们需要先对HTML符号进行转义，函数如下：
//转义字符为HTML实体，相当于PHP的htmlspecialchars()函数
functionhtml_encode(str)
{
vars="";
if(str.length==0)return"";
s=str.replace(/&/g,"&");
s=s.replace(/</g,"<");
s=s.replace(/>/g,">");
s=s.replace(/\"/g,""");
returns;
}
//HTML实体转换为HTML标签，相当于PHP的htmlspecialchars_decode()函数
functionhtml_decode(str)
{
vars="";
if(str.length==0)return"";
s=str.replace(/&/g,"&");
s=s.replace(/</g,"<");
s=s.replace(/>/g,">");
s=s.replace(/"/g,"\"");
returns;
}
4转义后再提交
修改HTML代码，把textarea的name属性改成另外一个名称，如source改成html_source，
<formaction="save.php"method="post"> <textareaname="html_source"></textarea> <buttontype="submit">提交</button> </form>
然后就可以在post之前转义textarea内容，再提交source就可以了，如下：
$("form[method='post']").on('submit',function(e){
e.preventDefault();
varform=$(this);
varhtml_source=encodeURIComponent(html_encode(form.find('textarea[name=html_source]').val()));
form.find('textarea[name=html_source]').prop('disabled',true);
$.post(
form.attr("action"),
form.serialize()+'&source='+html_source,
function(result){
$('.alert').html(result.msg).show().delay(1500).fadeOut();
if(result.success){
setTimeout(function(){
window.location.href="index.php";
},1000);
}else{
form.find('textarea[name=html_source]').prop('disabled',false);
returnfalse;
}
},
'json'
);
});
这样就可以顺利提交了，下次PHP显示时，用 htmlspecialchars_decode()函数解码就可以正常显示。