1. 程式人生 > >修改editor編輯器修改圖片時 寬高以屬性形式出現 增加行內樣式

修改editor編輯器修改圖片時 寬高以屬性形式出現 增加行內樣式

今天,做一個需求的時候 發現,CSS樣式會覆蓋屬性,這就導致了 需要行內樣式才能生效,這就鬱悶了。應為圖片標籤 都是直接儲存在資料庫的 我沒辦法一一修改額,叫長傳商品的同事 一個一個寫行內樣式也科學,所以我就打算更改上傳圖片和修改圖片屬性時增加一個行內樣式,公司用的是editor富文字編輯器,檢視上傳後圖片程式碼是這樣的

然後在Editor主JS檔案裡面搜尋 <img src= 找到了這一行

看名字就知道這也該是上傳後插入圖片時候的操作了,我增加

html += 'style="width:' + _escape(width) + 'px;" ';

測試了一下 上傳圖片時指定了寬度就增加了一個行內樣式,效果達到了。我再測試一下修改圖片屬性的時候 發現沒有增加,打個斷點後發現,修改圖片屬性的時候沒有呼叫這個方法,

這就尷尬了,不知道他呼叫哪個方法,就很鬱悶了。只能通關檢視事件監聽器 一步一步的除錯了

通過事件 監聽器 轉到了這裡

下個斷點除錯,經過一系列的跟蹤後發現了 他呼叫了這個方法

這個方法在他一個叫images.js裡面,使用console.log(img)列印看看是不是我們修改的那個img物件,

列印後確實是我們要的img物件 然後在他下面增加兩行

img.css('width',width); //更改行內樣式 個人修改
img.css('height', height); //更改行內樣式 個人修改
然後儲存 測試一下,效果達到了。