DBMNG数据库管理与应用

科学是实事求是的学问,来不得半点虚假。
当前位置:首页 > 经验分享 > WEB

Kindeditor从数据库中读取内容不正确的解决办法

首先说明一下看,kindeditor是一个好用的编辑器。在使用的时候我们有时会遇到这样的问题:

使用kindeditor编辑器编辑后提交到数据库中的内容再次读取出来显示的不正确了,这里做一下简单探讨。

在使用Kindeditor的时候我们往往用js调用来创建,如:

<script type="text/javascript">
			KindEditor.ready(function(K) {
				K.create('#content', {
					themeType : 'default',
					allowFileManager : true,
					uploadJson : 'jsonuploadfiles.jsp',
				fileManagerJson : 'jsonfilemanagerfiles.jsp'
				});

			});
</script>
然后创建一个隐藏的文本域textarea来保存数据,如

<textarea id="content" name="content" style="width:100%;height:400px;visibility:hidden;"></textarea>

这个操作在提交到数据库的过程中没有什么问题(当然要处理好sql语句的问题,最好用数组参数插入,一方面防止注入特殊字符,另一方面也可以防止某些字符插入时导致执行失败的问题,这个问题我们会在另一篇中讨论),但是当从数据库中读出的时候就会出现问题了,比如以下内容为读取数据库内容时的赋值代码:(其中<%= content %>为从数据库中直接读取出来的内容)

<textarea id="content" name="content" style="width:100%;height:400px;visibility:hidden;"><%= content %></textarea>

这种情况下,如果遇到html或其他特殊标记的内容就会导致这个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>jQuery渐变/淡入淡出焦点幻灯图代码</title>
<script type="text/javascript" src="js/jquery.1.4.2-min.js"></script>
……
</body>
</html> 

这个时候kindeditor就不能正确显示可视化编辑的界面了,点击查看源代码也看不到正确的源代码了,这样的内容如果编辑之后再次提交,势必造成内容不正确。这个时候我们考虑两个解决方法: 

一、这个原因是因为从数据库中读取的数据与网页中原有的html源代码中的字符混淆到一起导致textarea不能正确显示因而再导致kindeditor不能正确读取和显示产生的,那么我们可以考虑让这段从数据库中读取的数据不要直接混淆在html代码中从而解决问题。

也就是说让这段数据只在内存中存在而不直接穿插和显示在html网页代码中。那么这个问题该怎么解决呢?我们就想到一个方法,那就是ajax,我们可以等这个页面加载后再用ajax发起一个异步请求从数据库中读取数据,然后赋值给textarea文本域,然后再加载kindeditor来同步显示读取出来的内容,这样的话就不用在html源代码中显示对应的含有特殊字符的数据了,从而避免掉这个问题:

             var htmlobj=$.ajax({url:"Ajax.action?id="+<%=articleID%>,async:false});//从数据库中读取指定内容
             $("#content").val(htmlobj.responseText);//将读取内容赋值给textarea文本域
             $.getScript('kindeditor40/kindeditor-min.js', function() {//动态创建kindeditor并同步textarea文本域中的内容
	         KindEditor.basePath = 'kindeditor40/';
	         KindEditor.create('textarea[name="content"]', {
				themeType : 'default',
				allowFileManager : true,
				uploadJson : 'jsonupload.jsp',
				fileManagerJson : 'jsonfilemanager.jsp'
				});
           });

二、可以用htmlencode()的方法来解决,

在内容被显示之前先进行htmlencode()编码,这里以java为例,可以调用commons-lang.jar这个包中的

org.apache.commons.lang.StringEscapeUtils方法进行编码

那么上面的内容就变成了

<textarea id="content" name="content" style="width:100%;height:400px;visibility:hidden;"><%= StringEscapeUtils.escapeHtml( content )%></textarea>

然后kindeditor又支持这样编码后的解析,但是在html源代码中这些数据又不会混乱,这个时候问题就解决了。

另:asp中有Server.Htmlencode()方法。


本站文章内容,部分来自于互联网,若侵犯了您的权益,请致邮件chuanghui423#sohu.com(请将#换为@)联系,我们会尽快核实后删除。
Copyright © 2006-2023 DBMNG.COM All Rights Reserved. Powered by DEVSOARTECH            豫ICP备11002312号-2

豫公网安备 41010502002439号