1. 程式人生 > >百度ueditor富文字編輯器插入html程式碼問題

百度ueditor富文字編輯器插入html程式碼問題

今天下午想把ueditor儲存的html程式碼從資料庫取出來放回到ueditor中編輯,然後就一直放不進去,通過不斷地測試終於成功,接下來我講一下我的解決方法

從後臺取到值後想在js中直接用

UE.getEditor('editor').execCommand('insertHtml', '${queryArtid.aContent }');

方法插入, 但在${queryArtid.aContent }資料的兩邊加了 ’ ’ 後,原本的html程式碼符號就亂了,因此我們不能直接把資料給它,得通過一箇中轉站,不再使用 ’ ’ ;

<!-- 現將博文內容放到code中,然後ueditor再從這裡取值 -->
<code id="testcon" style="display:none;"> ${queryArtid.aContent } </code>

<code>標籤保持程式碼原樣,不會被編譯;
然後就再次使用賦值方法

UE.getEditor('editor').execCommand('insertHtml', $('#testcon').html());

到了這一步,哎?怎麼還是沒用呢,不要急,還有一步 就是延遲賦值的時間,等js檔案都載入完後再插入值,方法如下

$(function(){
            window.setTimeout(setContent,1000
);//一秒後再呼叫賦值方法 }); //給ueditor插入值 function setContent(){ UE.getEditor('editor').execCommand('insertHtml', $('#testcon').html()); }

這是我編輯前的樣子

這裡寫圖片描述

這是點選編輯後的樣子

這裡寫圖片描述

歡迎轉載,但請註明出處!