转发:https://blog.csdn.net/SI734/article/details/87867464

问题: 手机端展示的图片超出屏幕

百度UEditor_解决图片在手机端的自适应问题

解决方法: 在页面引入 {ueditor_home}/ueditor.all.js 找到以下内容并添加红色部分
function callback(){
    try{
        var link, json, loader,
            body = (iframe.contentDocument || iframe.contentWindow.document).body,
            result = body.innerText || body.textContent || '';
        json = (new Function("return " + result))();
        link = me.options.imageUrlPrefix + json.url;
        if(json.state == 'SUCCESS' && json.url) {
            loader = me.document.getElementById(loadingId);
            loader.setAttribute('src', link);
            loader.setAttribute('_src', link);
            loader.setAttribute('title', json.title || '');
            loader.setAttribute('alt', json.original || '');
            loader.setAttribute('style','max-width:100%');//解决图片自适应问题
            loader.removeAttribute('id');
            domUtils.removeClasses(loader, 'loadingclass');
        } else {
            showErrorLoader && showErrorLoader(json.state);
        }
    }catch(er){
        showErrorLoader && showErrorLoader(me.getLang('simpleupload.loadError'));
    }
    form.reset();
    domUtils.un(iframe, 'load', callback);
}

文件部署后效果如下:

编辑器部署前:                                                                        编辑器部署后:

百度UEditor_解决图片在手机端的自适应问题 百度UEditor_解决图片在手机端的自适应问题

   

 

    

手机端显示效果:

百度UEditor_解决图片在手机端的自适应问题


转发:https://blog.csdn.net/SI734/article/details/87867464

相关文章: