天天看點

UEditor 上傳圖檔尺寸縮放 并保持到網頁顯示的方法解決

目前搜尋到的方法都是在ueditor上編輯框内顯示解決問題的方法,如果一旦用getcontent()或者點選源碼之後在前端就會變成正常

的圖檔尺寸。

其實問題是出在getcontent()方法是過濾編輯框的資訊的,是以隻需要把img 内的style 設定白名單就好了~

第一步

在ueditor.all.js裡找到

callback()

加入lorder.style="width:yoursize";

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.removeAttribute('id');
                            domUtils.removeClasses(loader, 'loadingclass');
                            ///加入樣式
                            loader.style = "width:100px";
  }
           

第二步

在ueditor.config.js裡找到

whitList:

在img: 添加 'style’

img:  ['src', 'alt', 'title', 'width', 'height', 'id', '_src', 'loadingclass', 'class', 'data-latex','style'],
           

做完以上兩步 ueditor 對圖檔的樣式設定就可以儲存了~