kindEditor富文本编辑器

2018-08-31  本文已影响0人  东方舵手

1. 引入js和css

<link href="/js/kindeditor-4.1.10/themes/default/default.css" type="text/css" rel="stylesheet">
<script type="text/javascript" charset="utf-8" src="/js/kindeditor-4.1.10/kindeditor-all-min.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/kindeditor-4.1.10/lang/zh_CN.js"></script>

2. 初始化富文本 必须有个textarea

<textarea style="width:800px;height:300px;visibility:hidden;" name="desc"></textarea>

3. js 初始化代码

<script type="text/javascript">
    var itemAddEditor ;
    //页面初始化完毕后执行此方法
    $(function(){
        //创建富文本编辑器
        itemAddEditor = TT.createEditor("#itemAddForm [name=desc]");

    });
</script>
var TT =  {
    // 编辑器参数
    kingEditorParams : {
        //指定上传文件参数名称
        filePostName  : "uploadFile",
        //指定上传文件请求的url。
        uploadJson : '/pic/upload',
        //上传类型,分别为image、flash、media、file
        dir : "image"
    },
    createEditor : function(select){
        return KindEditor.create(select, TT.kingEditorParams);
    }

};

4. 在表单中提交前 需要对kindEditor的控件进行同步

//同步文本框中的内容
itemAddEditor.sync();
上一篇下一篇

猜你喜欢

热点阅读