KindEditor 是一套开源的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果,开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化了，下面我们就一起来看看phpweb更换kindeditor编辑器的过程，希望文章可帮助到各位。

都知道phpweb自带的编辑器很不好用，有的时候提交会出现很多问题！ 今天开始动工把phpweb的编辑器给换了 首先更换news 模块下的编辑器

1.到kindeditor 官方网站上面下载最新的kindeditor包。

2.删除不用的文件夹，asp,jsp等

3.把kindeditor 的文件夹放入phpweb 根目录下

4.打开news/admin/news_conadd.php 大概108行处

<input type="hidden" name="body" value="<?php echo $body; ?>" />
<script type="text/javascript" src="../../kedit/KindEditor.js"></script>
<script type="text/javascript">
var editor = new KindEditor("editor");
editor.hiddenName = "body";
editor.editorWidth = "680px";
editor.editorHeight = "300px";
editor.skinPath = "../../kedit/skins/default/";
editor.uploadPath = "../../kedit/upload_cgi/upload.php";
editor.imageAttachPath="news/pics/";
editor.iconPath = "../../kedit/icons/";
editor.show();
function KindSubmit() { editor.data(); }
</script>

更换为

<script charset="utf-8" src="../../kindeditor/kindeditor.js"></script>
<script charset="utf-8" src="../../kindeditor/lang/zh_CN.js"></script>
<script>
var editor;
KindEditor.ready(function (K) {
editor = K.create('#editor_id',{
width:'680px',
height:'300px',
uploadJson:'upload_json.php',
fileManagerJson : ' file_manager_json.php & rsquo; ,
allowFileManager : true,
syncType : "form", afterCreate : function () {
var self = this;
self.sync();
}, afterChange : function () {
var self = this;
self.sync();
}, afterBlur : function () {
var self = this;
self.sync();
}
});
</script>

<textarea  name="body" id="editor_id" style="width:680px;height:300px;"/><?php echo $body;?></textarea>

注意：红色标注处，按照官方提供的demo.php文件中写的方法，得不到textarea 里面的内容！ 5.复制kindeditorphp文件夹下面upload_json.php和file_manager_json.php (新版中存在 JSON.php也一起复制)文件到newsadmin下 修改2个文件

//文件保存目录路径 $save_path = $php_path . '../attached/'; //文件保存目录URL $save_url = $php_url . '../attached/';

为

//文件保存目录路径 $save_path = $php_path . '../pics/'; //文件保存目录URL $save_url = $php_url . '../pics/';

碰到问题

kindeditor 用ajax提交会出现如下问题： 提交第二次才能获取到真实的值。用如下方法解决：

加一个,afterChange: function (e) { this.sync() }  同步下数据即可

替换就ok：

教程网址:http://www.phprm.com/develop/72358.html

欢迎收藏∩_∩但请保留本文链接。