• KindEditor使用


    参考链接:http://www.cnblogs.com/sntetwt/p/3679837.html

    http://kindeditor.net/docs/option.html#cssdata

    1 设置初始字体:

    KindEditor.ready(function(K) {
        window.editor = K.create('textarea[name="content"]', {
            cssData: 'body {font-family: "微软雅黑"; font-size: 14px}'
        });
    });

    当引入kindedit的相关文件后,就可以进行初始化操作,如果不设置,那么引入的就是默认样式,包含全部的选项功能。 K.create('textarea[name="content"]',{})

    这是代表选择name=content的textarea,就和选择器是一样的,这样就可以单独配置每一个textarea。后面就是对这个textarea进行单独配置。cssData就是对这个的整体初始配置,例如body配置的字体为微软雅黑,当然如果需要配置的文件很多,那么也可以直接引入一个css文件,用cssPath进行配置。

    2 设置文本框是否可拖动:resizeType

         2或1或0,2时可以拖动改变宽度和高度,1时只能改变高度,0时不能拖动。

    • 数据类型: Int
    • 默认值: 2

    代码插入功能开启和代码高亮

    首先要设置items中的code

    KindEditor.ready(function(K) {
              editor = K.create('textarea', {
              allowImageUpload : true,
              cssData: 'body {font-family: "微软雅黑"; font-size: 16px}',//设置默认字体
              uploadJson: '/uploadImg',//设置action  请求路径
    //          uploadJson: '/ueditor/ue',
              resizeType : 0,   //编辑区域大小禁止改变
              items : [
                'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic',
                'underline', 'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright',
                'insertorderedlist', 'insertunorderedlist', '|', 'emoticons', 'image','code', 'link','fullscreen']
              });
            });

    相关功能选项的手册

    http://kindeditor.net/docs/option.html

    http://www.hdj.me/use-kindeditor-prettify-plugin

    主要要用到插件文件夹下的code插件  引入

    <link rel="stylesheet" type="text/css" href="kindedit/plugins/code/prettify.css" />
    <script type="text/javascript" src="kindedit/plugins/code/prettify.js"></script>
    <script>
    $(function(){ prettyPrint(); });
    </script>

    后台编辑器声明的时候加上插件样式,缺省这个参数,编辑器中插入代码跟普通文字一样,并且再次编辑的时候被隐藏了,所以这一步很关键。(这一步没有很懂)

    var editor = KindEditor.create('textarea.editor', {
        cssPath : ['[kePath]/plugins/code/prettify.css']
    });

    获取textarea的值

    https://blog.phpha.com/backup/archives/510.html

    我的个人博客中是  editor.html();  editor.html("设置内容")

  • 相关阅读:
    服务器内部模拟Http请求
    面试题分类
    Linux常用命令
    css补充之hover与overflow
    css之position
    css边框及float、display样式
    css存在形式及优先级
    css选择器
    body标签之fieldest与label标签
    body内标签之table标签
  • 原文地址:https://www.cnblogs.com/djlxs/p/5611764.html
Copyright © 2020-2023  润新知