当前位置:首页 > 网页设计 >

关于UEditor前端配置项说明

发布时间:2020-12-24 20:20:52 作者:佚名 阅读:(513)

UEditor 的配置项分为两类:前端配置项 和 后端配置项

后端配置项具体看这个文档L:后端配置项说明

本文档介绍如何通过设置前端配置项,定制编辑器的特性,配置方法主要通过修改ueditor.config.js,另外在编辑器实例化的时候也可以传入配置参数

var ue = UE.getEditor('container', {
    toolbars: [
        ['fullscreen', 'source', 'undo', 'redo', 'bold']
    ],
    autoHeightEnabled: true,
    autoFloatEnabled: true
});

读取配置项

读取配置项可以通过getOpt方法读取

var lang = ue.getOpt('lang'); //默认返回:zh-cn

前端配置项说明

以下的"URL"是ueditor.config.js文件所在目录

UEDITOR_HOME_URL {Path String} [默认值:根据config文件路径自动获取] // 为编辑器实例添加一个路径,这个不能被注释

serverUrl {Path String} [默认值:URL + "php/controller.php"] // 服务器统一请求接口路径

toolbars {2d Array} //工具栏上的所有的功能按钮和下拉框,可以在new编辑器的实例时选择自己需要的从新定义

labelMap {Object} [默认:从lang包的labelMap项获取] //参数格式是键值对,键名对应toolbar参数的项:{"bold": "加粗"} ],当鼠标放在工具栏上时显示的tooltip提示,留空支持自动多语言配置,否则以配置值为准

lang {String} [默认值:"zh-cn"] //lang值也可以通过自动获取 (navigator.language||navigator.browserLanguage ||navigator.userLanguage).toLowerCase(),语言配置项,默认是zh-cn。有需要的话也可以使用如下这样的方式来自动多语言切换,当然,前提条件是lang文件夹下存在对应的语言文件:

langPath {Path String} [默认值:URL +"lang/"] //语言包文件存放目录

theme {String} [默认值:'default'] //主题配置项,默认是default。有需要的话也可以使用如下这样的方式来自动多主题切换,当然,前提条件是themes文件夹下存在对应的主题文件:

themePath {Path String} [默认值:URL +"themes/"] //现有如下皮肤:default

zIndex {Number} [默认值:900] //编辑器在页面上的z-index层级的基数,默认是900

charset {String} [默认值:"utf-8"] //针对getAllHtml方法,会在对应的head标签中增加该编码设置。

customDomain {Boolean} [默认值:false] //若实例化编辑器的页面手动修改的domain,此处需要设置为true

isShow {Boolean} [默认值:true] //默认显示编辑器

textarea {String} [默认值:'editorValue'] // 提交表单时,服务器获取编辑器提交内容的所用的参数,多实例时可以给容器name属性,会将name给定的值最为每个实例的键值,不用每次实例化的时候都设置这个值

initialContent {String} [默认值:'欢迎使用ueditor!'] //初始化编辑器的内容,也可以通过textarea/script给值,看官网例子

autoClearinitialContent {Boolean} [默认值:true] //是否自动清除编辑器初始内容,注意:如果focus属性设置为true,这个也为真,那么编辑器一上来就会触发导致初始化的内容看不到了

focus {Boolean} [默认值:false] //初始化时,是否让编辑器获得焦点true或false

initialStyle {String} [默认值:'p{line-height:1em}']//编辑器层级的基数,可以用来改变字体等 //如果自定义,最好给p标签如下的行高,要不输入中文时,会有跳动感

iframeCssUrl {Path String} [默认值:URL + '/themes/iframe.css'] //给编辑器内部引入一个css文件

indentValue {String} [默认值:'2em'] //首行缩进距离,默认是2em

initialFrameWidth {Number} [默认值:1000] //初始化编辑器宽度,默认1000

initialFrameHeight {Number} [默认值:320] //初始化编辑器高度,默认320

readonly {Boolean} [默认值:false] //编辑器初始化结束后,编辑区域是否是只读的,默认是false

autoClearEmptyNode {Boolean} [默认值:true] //getContent时,是否删除空的inlineElement节点(包括嵌套的情况)

enableAutoSave {Boolean} [默认值:true] //启用自动保存

saveInterval {Number} [默认值:500] //自动保存间隔时间,单位ms

imageScaleEnabled {Boolean} [默认值:true] //启用图片拉伸缩放

fullscreen {Boolean} [默认值:false] //是否开启初始化时即全屏,默认关闭

imagePopup {Boolean} [默认值:true] //图片操作的浮层开关,默认打开

autoSyncData {Boolean} [默认值:true] //自动同步编辑器要提交的数据

emotionLocalization {Boolean} [默认值:false] //是否开启表情本地化,默认关闭。若要开启请确保emotion文件夹下包含官网提供的images表情文件夹

retainOnlyLabelPasted {Boolean} [默认值:false] //粘贴只保留标签,去除标签所有属性

pasteplain {Boolean} [默认值:false] //是否默认为纯文本粘贴。false为不使用纯文本粘贴,true为使用纯文本粘贴

filterTxtRules {Object} //纯文本粘贴模式下的过滤规则

//默认值:
function() {
    function transP(node) {
        node.tagName = 'p';
        node.setStyle();
    }
    return {
        //直接删除及其字节点内容
        '-': 'script style object iframe embed input select',
        'p': {
            $: {}
        },
        'br': {
            $: {}
        },
        'div': {
            '$': {}
        },
        'li': {
            '$': {}
        },
        'caption': transP,
        'th': transP,
        'tr': transP,
        'h1': transP,
        'h2': transP,
        'h3': transP,
        'h4': transP,
        'h5': transP,
        'h6': transP,
        'td': function(node) {
            //没有内容的td直接删掉
            var txt = !! node.innerText();
            if (txt) {
                node.parentNode.insertAfter(UE.uNode.createText('    '), node);
            }
            node.parentNode.removeChild(node, node.innerText())
        }
    }
}()

allHtmlEnabled [默认值:false] //提交到后台的数据是否包含整个html字符串

insertorderedlist //有序列表的下拉配置,值留空时支持多语言自动识别,若配置值,则以此值为准

//默认值:
{
//自定的样式
'num': '1,2,3...',
'num1': '1),2),3)...',
'num2': '(1),(2),(3)...',
'cn': '一,二,三....',
'cn1': '一),二),三)....',
'cn2': '(一),(二),(三)....',
//系统自带
'decimal': '' , '1,2,3...'
'lower-alpha': '' , // 'a,b,c...'
'lower-roman': '' , //'i,ii,iii...'
'upper-alpha': '' , //'A,B,C'
'upper-roman': '' //'I,II,III...'
}

insertunorderedlist //无序列表的下拉配置,值留空时支持多语言自动识别,若配置值,则以此值为准

{ //自定的样式
    'dash': '— 破折号', //-破折号
    'dot': ' 。 小圆圈', //系统自带
    'circle': '', // '○ 小圆圈'
    'disc': '', // '● 小圆点'
    'square': '' //'■ 小方块'
}]

listDefaultPaddingLeft [默认值:'30'//默认的左边缩进的基数倍

listiconpath [默认值:'http://bs.baidu.com/listicon/']//自定义标号的路径

maxListLevel [默认值:3] //限制可以tab的级数, 设置-1为不限制

autoTransWordToList [默认值:false] //禁止word中粘贴进来的列表自动变成列表标签

fontfamily //字体设置 label留空支持多语言自动切换,若配置,则以配置值为准

//默认值:
[{
    label: '',
    name: 'songti',
    val: '宋体,SimSun'
}, {
    label: '',
    name: 'kaiti',
    val: '楷体,楷体_GB2312, SimKai'
}, {
    label: '',
    name: 'yahei',
    val: '微软雅黑,Microsoft YaHei'
}, {
    label: '',
    name: 'heiti',
    val: '黑体, SimHei'
}, {
    label: '',
    name: 'lishu',
    val: '隶书, SimLi'
}, {
    label: '',
    name: 'andaleMono',
    val: 'andale mono'
}, {
    label: '',
    name: 'arial',
    val: 'arial, helvetica,sans-serif'
}, {
    label: '',
    name: 'arialBlack',
    val: 'arial black,avant garde'
}, {
    label: '',
    name: 'comicSansMs',
    val: 'comic sans ms'
}, {
    label: '',
    name: 'impact',
    val: 'impact,chicago'
}, {
    label: '',
    name: 'timesNewRoman',
    val: 'times new roman'
}]

欢迎分享转载→ 关于UEditor前端配置项说明

© 2015-2021 - 吾爱编程网 版权所有 苏ICP备18033726号-1关于我们 - 网站声明 - 联系我们