ueditor多個編輯器讀取內容與寫入內容的問題

在使用ueditor過程中,有時侯會遇到需要獲取編輯器中內容或者將一些內容插入到編輯器中的情況。

假設我在頁面中使用textarea渲染了兩個編輯器其id分別為edit1與edit2,如下圖:

ueditor多個編輯器讀取內容與寫入內容的問題

獲取編輯器內容

在沒有使用Ueditor將textarea渲染為編輯器時可以使用【$(“#id編號”)。val();】【$(“#id編號”)。text();】【$(“#id編號”)。html();】來獲取其內容。但是將textarea渲染為編輯器後發現獲取到的內容並不是我們想要的內容。下面看一下渲染前後控制檯的結果:

ueditor多個編輯器讀取內容與寫入內容的問題

那麼要如何獲取其內容呢?其實Ueditor提供了這方面的API函式。具體為獲得內容getContent、獲得純文字內容getContentTxt、寫入內容setContent()、追加內容setContent(true)。具體使用方法也很簡單【UE。getEditor(“edit1”)。getContent();】編號不需要加#標識了。在同個頁面渲染了多個編輯器時這樣還是挺方便的。同樣看一下控制檯中的執行結果:

ueditor多個編輯器讀取內容與寫入內容的問題

將內容寫入到編輯器中

獲取到內容後,寫入內容也就是一樣的道理了。寫入內容setContent()與追加內容是一個透過引數true來控制。如將一段文字寫入到編輯器中方法為:【UE。getEditor(“edit1”)。setContent(“寫入一段內容”);】【UE。getEditor(“edit1”)。setContent(“追加寫入一段內容”,true);】。效果如下面四張圖片:

ueditor多個編輯器讀取內容與寫入內容的問題

ueditor多個編輯器讀取內容與寫入內容的問題

ueditor多個編輯器讀取內容與寫入內容的問題

ueditor多個編輯器讀取內容與寫入內容的問題

熟悉了獲取內容與寫入內容的方法後,要實現內容互換追加就清楚了。最後我寫了個函式來實現左右內空之間的轉換。個人見解,勿噴,本人並未系統學過程式。

因為不能貼程式碼就不把我最後實現內容追加互換的函式貼出來了。