[笔记]百度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);
}

文件部署后效果如下:

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

   

 

    

手机端显示效果:

 

其他参考链接:

关于百度编辑器中图片手机端自适应、微信jssdk当前页链接、setinterval用法

百度ueditor上传图片时设置默认宽高度

解决使用百度UEditor编辑器后移动端图片被拉伸问题

关于ueditor上传图片后拖动图片自动添加style样式 手机端不能自适应问题