kindeditor 简单说明

这个编辑器配置起来很简单。看下

 

所需要的文件

<link rel="stylesheet" href="../themes/default/default.css" />
<link rel="stylesheet" href="../plugins/code/prettify.css" />
<script charset="utf-8" src="../kindeditor.js"></script>
<script charset="utf-8" src="../lang/zh_CN.js"></script>
<script charset="utf-8" src="../plugins/code/prettify.js"></script>

由于该编辑器第一次中，版本都4.0了 呵呵 。。 每个文件的作用不是很清楚。

下载该编辑器之后有一个 php 目录 他是在 PHP 配置使用的一个 demo

 

具体配置

KindEditor.ready(function(K) {
	//  将修改 name 为 content1 的 textarea 
	var editor1 = K.create('textarea[name="content1"]', {
		cssPath : '../plugins/code/prettify.css',  // 样式路径
		uploadJson : '../php/upload_json.php',	// 如果有上传文件 那么 upload_json.php 会做处理
		fileManagerJson : '../php/file_manager_json.php',	
		allowFileManager : true,
		// 编辑器功能限制 ， 下面的 items 是设置精简版的
		items : [
				'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
				'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
				'insertunorderedlist', '|', 'emoticons', 'image', 'link'] ,

		afterCreate : function() {
			var self = this;
			K.ctrl(document, 13, function() {
				self.sync();
				K('form[name=example]')[0].submit();
			});
			K.ctrl(self.edit.doc, 13, function() {
				self.sync();
				K('form[name=example]')[0].submit();
			});
		}
	});
	prettyPrint();
});

 

html 部分

<form name="content1" method="post" action="demo.php">

		<textarea name="content1" style="width:700px;height:200px;visibility:hidden;"><?php echo htmlspecialchars($htmlData); ?></textarea>
		<br />
		<input type="submit" name="button" value="提交内容" /> 
	</form>

 

js 验证内容是否为空

editor1.isEmpty() 

如果返回的是true 则是空内容。

配置 OK ，也就是说 如果你有一个发布文章的文件 那么将上面的导入代码加到你的页面中，然后在将配置代码加到你的发布页面里。

将 textarea 的 name 属性的值改为 content1 （当然这个名字你可以改别的）就OK了。

 

如果在编辑内容的途中上传了 本地图片， 这个时候有个问题，因为大小可以随意修改，很可能会上传极度大的图片。

所以需要修改 upload_json.php 。该文件中只做了对文件的保存路径和名字 没有缩略过程，是直接用 move_file_uploaded 移动。

将移动附件的代码删除，用自己的缩略图函数代替。

 

该文章只是防止后期在使用的时候出现问题，所以先记一下 写的很粗略 ~

先把这个项目做完 然后在好好去研究 在发详细的说明！