• home > php > phpcms >

    ueditor样式过滤去除和远程图片上传自定义

    Author:zhoulujun Date:

    ueditor自定义编辑的时候,比如需要做延迟加载,这个时候需要自定义图片等,但是,ueditor会去除img上面的属性,比如data-original和把远程

    ueditor自定义编辑的时候,比如需要做延迟加载,这个时候需要自定义图片等,但是,ueditor会去除img上面的属性,比如data-original和把远程图片自动上传。

    这个时候,首先,需要给图片自动上传加上属性,不如对于jquery.lazyload延迟加载的图片,必定带有data-original属性,只要检测出此属性,就不远程上传。其它属性自定义提那家,代码如下:

    'wordimage':{
                    execCommand:function () {
                        var images = domUtils.getElementsByTagName(me.body, "img");
                        var urlList = [];
                        for (var i = 0, ci; ci = images[i++];) {
                            if(ci.getAttribute("data-original")||ci.getAttribute("original")||ci.getAttribute("local")||ci.getAttribute("remote")||ci.getAttribute("qiniu")){
                                break;
                            }else {
                                var url = ci.getAttribute("word_img");
                                url && urlList.push(url);
                            }
    
                        }
                        return urlList;
                    },

    第二,去除,对于script的过滤,对于script标签,添加特定的id活着class,不让ueditor处理。

                        case 'style':
                        case 'script':
                            if(node.id==='andyZhou'||node.className==="andyZhou"){
                                break;
                            }else {
                                node.setAttr({
                                    cdata_tag: node.tagName,
                                    cdata_data: (node.innerHTML() || ''),
                                    '_ue_custom_node_':'true'
                                });
                                node.tagName = 'div';
                                node.innerHTML('');
                                break;
                            }
                            break;

    第三,在白名单中添加script和style标签。

                script:['src','defer','async','charset'],
                source:['src'],
                style:[],

    这个时候,你就可以在html模式下自定义编辑,又享受ueditor的好处。

    这个是自己DIY随便琢磨的,如果有更好的模式,请指教,多些。


    转载本站文章《ueditor样式过滤去除和远程图片上传自定义》,
    请注明出处:https://www.zhoulujun.cn/html/php/phpcms/2018_0316_8083.html