UEditor 富文本编辑器踩过的那些坑

时间:2022-12-25 18:14:20

Keng 1

错误

The given range isn't in document.        ueditor.all.min.js:8

描述

所给的范围不对,什么范围?参数范围

解决

例如调用插入表格
ue.execCommand('inserttable')
原本以为是
ue.execCommand('inserttable',2,2,1)
执行后报错
The given range isn't in document.
意思是参数错误

正确的使用传参方式是
ue.execCommand('inserttable',{numRows:2, numCols:2, border:1});

Keng 2

问题

UEditor如何插入表格

解决

注意:如果外部触发,既UEditor没获取焦点,必须先获取加点
ue.focus();
参数分别是行数,列数,边框宽度
ue.execCommand('inserttable',{numRows:2, numCols:2, border:1});

Keng 3

问题

UEditor模拟placeholder效果

解决

UE.Editor.prototype.placeholder = function (justPlainText) {
    var _editor = this;
    _editor.addListener("focus", function () {
        var localHtml = _editor.getPlainTxt();
        if ($.trim(localHtml) === $.trim(justPlainText)) {
            _editor.setContent('<p>' + "" + '</p>');
        }
    });
    _editor.addListener("blur", function () {
        var localHtml = _editor.getContent();
        if (!localHtml) {
            _editor.setContent('<p style="color: #CDCDCD">' + justPlainText + '</p>');
            //_editor.setContent(justPlainText);
        }
    });
    _editor.ready(function () {
        _editor.fireEvent("blur");
    });
};
//实例化编辑器example
var editor = UE.getEditor(编辑器id);
//placeholder内容(只能是文本内容)
editor.placeholder("Please enter some text...");