国产网页在线编辑器kindeditor的使用

来源:互联网 发布:统计软件购买 预算 编辑:程序博客网 时间:2024/04/27 23:42

           作为以前在使用fckeditor,后来浏览器更新后发现fck编辑不好用(而且是致命的问题,根本不能编辑),而且界面也做的不怎样!后来发现国产中有一款开源的网页在线编辑器,试了一下感觉效果很不错!使用也非常方便

         下面来说说使用kindeditor的几个步骤:

         1. 加载kindeditor使用所必需的文件

        <link rel="stylesheet" href="kindeditor/themes/default/default.css" />      //编辑器主要样式
<link rel="stylesheet" href="kindeditor/plugins/code/prettify.css" />    //修饰样式
<script charset="utf-8" src="kindeditor/kindeditor.js"></script>   //编辑器主js库
<script charset="utf-8" src="kindeditor/lang/zh_CN.js"></script>  //语言包
<script charset="utf-8" src="kindeditor/plugins/code/prettify.js"></script>   //修饰js

      2.定义一个隐藏的textarea 

       <textarea id="editor" name="editor" rows="" cols="" style="width:100%; height: 450px; visibility: hidden;">

    3.定义kindeditor组件

       <script>
KindEditor.ready(function(K) {
var editor1 = K.create('textarea[name="editor"]', {
cssPath : 'kindeditor/plugins/code/prettify.css',
uploadJson : 'upload_json',  //上传处理
fileManagerJson : 'file_manager', //文件管理
allowFileManager : true
});
prettyPrint();
});
</script>

示例图片:


其他的可以查看官方文档。至于上传,可以使用官方给的示例代码,如果用作商业的话最好自己写。

0 0
原创粉丝点击