在PHP使用kindeditor

[版本说明:kindeditor-4.0.6(下载 https://code.google.com/p/kindeditor/downloads/list ),php-5.2.14+Zend Framework]

1.简介
KindEditor 是一套开源的在线HTML编辑器,主要用于让用户在网站上得到所见即所得编辑效果,开发人员能够用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本输入框。 KindEditor 使用 JavaScript 编写,能够无缝地与 Java、.NET、PHP、ASP 等程序集成,比较适合在 CMS、商城、论坛、博客、Wiki、电子邮件等互联网应用上使用。

主要特色
    快速:体积小,加载速度快
    开源:开放源代码,高水平,高品质
    底层:内置自定义 DOM 类库,精确操做 DOM
    扩展:基于插件的设计,全部功能都是插件,可根据需求增减功能
    风格:修改编辑器风格很是容易,只需修改一个 CSS 文件
    兼容:支持大部分主流浏览器,好比 IE、Firefox、Safari、Chrome、Opera

2.使用
下载后,解压,在须要使用kindeditor的页面加上如下代码:
(注意:js/css的引入路径必须填写正确)
<link rel="stylesheet" href="/kindeditor-4.0.6/themes/default/default.css" />
<link rel="stylesheet" href="/kindeditor-4.0.6/plugins/code/prettify.css" />
<script charset="utf-8" src="/kindeditor-4.0.6/kindeditor.js"></script>
<script charset="utf-8" src="/kindeditor-4.0.6/lang/zh_CN.js"></script>
<script charset="utf-8" src="/kindeditor-4.0.6/plugins/code/prettify.js"></script>
<script>
    KindEditor.ready(function(K) {
        var editor1=K.create('textarea[name="description"]',{//name=form中textarea的name属性
            cssPath : '/kindeditor-4.0.6/plugins/code/prettify.css',
            uploadJson : '/kindeditor-4.0.6/php/upload_json.php',
            fileManagerJson : '/kindeditor-4.0.6/php/file_manager_json.php',
            allowFileManager : true,
            afterCreate : function() {
                var self = this;
                K.ctrl(document, 13, function() {
                    self.sync();
                    K('form[name=myform]')[0].submit(); // name=form表单的name属性
                });
                K.ctrl(self.edit.doc, 13, function() {
                    self.sync();
                    K('form[name=myform]')[0].submit(); // name=form表单的name属性
                });
            }
        });
        prettyPrint();
    });
</script>
<form name="myform" method="post" action="根据实际填写">
    <textarea name="description" style="width:700px;height:200px;">
    </textarea>
    <br />
    <input type="submit" name="button" value="提交内容" /> (提交快捷键: Ctrl + Enter)
</form>
最后在action中使用$_REQUEST['description']便可获取到在文本编辑器中输入的内容。


3.效果图
php

在线例子
http://weizongwei.sinaapp.com/application/views/kindeditor1.php css

相关文章
相关标签/搜索