zoukankan      html  css  js  c++  java
  • 富文本编辑器kindeditor的使用

    第一步:导入前端js文件

     <!-- 富文本编辑器 -->
        <link rel="stylesheet" href="../plugins/kindeditor/themes/default/default.css" />
        <script charset="utf-8" src="../plugins/kindeditor/kindeditor-min.js"></script>
        <script charset="utf-8" src="../plugins/kindeditor/lang/zh_CN.js"></script>

    第二步:html页面中添加富文本编辑器输入框

     <div>kindeditor富文本编辑器</div>
     <div>
    <!--此处的name应与下方的editor=K.create('textarea[name="content"]')一致-->
    <textarea name="content" style="800px;height:400px;visibility:hidden;"></textarea>
    </div>

    第三步:添加富文本编辑器绑定的js代码

    <!-- 正文区域 /-->
    <script type="text/javascript">
    //定义一个全局变量
        var editor;
        KindEditor.ready(function(K) {
            editor = K.create('textarea[name="content"]', {
                allowFileManager : true
            });
    //此处是给编辑框赋予初始值
    //editor.html("123");
    }); </script>

    完整代码

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <!-- 富文本编辑器 -->
        <link rel="stylesheet" href="../plugins/kindeditor/themes/default/default.css"/>
        <script charset="utf-8" src="../plugins/kindeditor/kindeditor-min.js"></script>
        <script charset="utf-8" src="../plugins/kindeditor/lang/zh_CN.js"></script>
    </head>
    <body>
    <div>测试内容</div>
    <div>
        <!--此处的name应与下方的editor=K.create('textarea[name="content"]')一致-->
        <textarea name="content" style="800px;height:400px;visibility:hidden;"></textarea>
    </div>
    </body>
    <!-- 正文区域 /-->
    <script type="text/javascript">
    
        var editor;
        KindEditor.ready(function (K) {
            editor = K.create('textarea[name="content"]', {
                allowFileManager: true
            });
        });
    
    </script>
    </html>

  • 相关阅读:
    Poj3295 tautology
    Poj2586 每五个月都是亏
    Poj 2109 k^n = p.
    Poj2109 (2) k^n = p.
    Poj2109 (1) k^n = p.
    Poj2965 冰箱的开关
    Poj1328 用雷达覆盖所有的岛屿
    FASTER-RCNN
    卷积、池化计算
    理论感受野的计算
  • 原文地址:https://www.cnblogs.com/kitor/p/11162247.html
Copyright © 2011-2022 走看看