在项目中需要用到ckeditor富文本编辑器,碰到传递参数含有大量特殊字符问题。
方法一:get提交(该方法有字符长度限制,且需要对特殊字符处理)
JavaScript encodeURIComponent()函数
链接: encodeURIComponent释义.
对参数进行特殊字符编码后即可传递
//data值为<p style="text-align:center"><strong>Hello world!</strong></p>
var _data=CKEDITOR.instances.xwckeditor.getData();
//将data至后台并解析
$.post("${path}/demo/demoFunction?data="+escape(encodeURIComponent(_data)),function(data){
if(data.msg=='OK'){
layer.alert('OK', {icon : 3});
}
else
layer.alert('ERROR', {icon : 3});
},'json');
导入java.net后使用URLDecoder对参数进行解码转换获取
//Import java.net进行解码
URLDecoder urlDecoder=new URLDecoder();
//获取url参数
String data= urlDecoder.decode(request.getParameter("data"),"utf-8");
data的值为
<p style="text-align:center"><strong>Hello world!</strong></p>
方法二:jQuery post提交(无须处理特殊字符)
$.ajax({
cache:false,
type:"POST",
url:"${path}/demo/demoFunction",
data:{"data":_data},
async: false,
success:function(data){
if(data.msg=='OK'){
layer.alert('保存成功', {icon : 6},
function(index){location.reload();});
}
else
layer.alert('保存失败', {icon : 3});
}
});
CKeditor获取文本实现修改
后台向前端发送含有特殊字符的标签时,只需在前端进行处理,例如我们需要将后台中的一个文本段落在jsp中动态生成,request到jsp中的该段落含有",<,>等特殊字符(类推数据库读取文本,动态生成页面)
//后台传参
//字体居中加粗的一个段落字符串
String data="<p style=\"text-align:center\"><strong>Hello world!</strong></p>"
request.setAttribute("data", data);
-------------------------------我是一条完美分割线-------------------------------
//jsp页面
<script type="text/javascript">
$(function(){
alert($("#getData").val());//<p style="text-align:center"><strong>Hello world!</strong></p>
var editor = CKEDITOR.replace("xwckeditor");
var data=$("#getData").val();
//显示后台传递段落
editor.setData(data);
})
</script>
<textarea id="xwckeditor" name="xwckeditor" cols="20"
rows="2" class="ckeditor"></textarea>
//存放data值
<input type="hidden" id="getData" name="getData" value="${fn:escapeXml(data)}">
可以看出使用jstl fn:escapeXml() 函数即可解决特殊字符参数获取错误
本文探讨了在项目中使用CKEditor富文本编辑器时,如何处理传递参数中含有大量特殊字符的问题。介绍了两种方法:使用JavaScript encodeURIComponent()函数进行编码并通过GET方式提交,以及直接使用jQuery POST提交无需额外处理特殊字符。

402

被折叠的 条评论
为什么被折叠?



