如何在TinyMCE textarea中設置初始文本？

我在一個好奇的情況下，我以前沒有實現我在找什麼問題。下面的代碼是一個HTML網頁的一部分，這是主辦TinyMCE的豐富文本框：如何在TinyMCE textarea中設置初始文本？

... 
<textarea id="editing_field">This text is supposed to appear in the rich textbox</textarea> 
...

起初，這個當過預期，創造在它封閉的文本格式文本框。在某些時候，雖然，TinyMCE的代碼決定，textarea的HTML應該轉化爲以下幾點：

<textarea id="editing_field" style="display: none;"/> 
This text is supposed to appear in the rich textbox

這使得它不完全是理想的文本框下面的文字。我不知道是什麼導致了這種行爲的改變，儘管如果這可能會產生任何效果，我還會使用jQuery。

我可以解決這個問題，通過使用ajax或通過隱藏HTML中的文本並移動它，在頁面加載後，使用JavaScript將內容加載到文本框中。但是，如果可能的話，我想直接從PHP發送文本到文本框中。任何人都知道這裏發生了什麼，以及如何解決它？

更新2：我已成功複製導致行爲改變的情況：首先，我在textarea中使用純文本，就像在第一個代碼片段中一樣。然而，保存內容之後的文本看起來像這樣：

<p>This text is supposed to appear in the rich textbox</p>

的p標籤的存在導致TinyMCE的到一個封閉的textarea之間的轉換觸發到一個textarea這僅僅是一個單一的標記（如上圖所示）。

更新1：加入TinyMCE的配置文件：

tinyMCE.init({ 
     // General options 
     mode : "exact", 
     elements : "editing_field", 
     theme : "advanced", 
     skin : "o2k7", 
     skin_variant : "black", 
     plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template", 
     save_onsavecallback : "saveContent", 

     // Theme options 
     theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull", 
     theme_advanced_buttons2 : "search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,forecolor,backcolor", 
     theme_advanced_buttons3 : "hr,removeformat,|,sub,sup,|,charmap,emotions,|,print,|,fullscreen,code", 
     theme_advanced_buttons4 : "styleselect,formatselect,fontselect,fontsizeselect", 
     theme_advanced_toolbar_location : "top", 
     theme_advanced_toolbar_align : "left", 
     theme_advanced_statusbar_location : "bottom", 
     theme_advanced_resizing : false, 

     // Drop lists for link/image/media/template dialogs 
     template_external_list_url : "lists/template_list.js", 
     external_link_list_url : "lists/link_list.js", 
     external_image_list_url : "lists/image_list.js", 
     media_external_list_url : "lists/media_list.js", 

     // Replace values for the template plugin 
     template_replace_values : { 
      username : "Some User", 
      staffid : "991234" 
     }, 

     width : "450", 
     height : "500" 
    });

來源

2009-01-28 Morten Christiansen

您的Textarea是否在

看來我已經解決了這個問題，除非有任何邊界情況破壞了解決方案。我用下面的PHP代碼的網頁內容之前，我將它保存到數據庫中：

$content = str_replace(chr(10), "", $content); 
$content = str_replace(chr(13), "", $content); 
$content = str_ireplace('<','&#x200B;<',$content);

它所做的是它刪除任何新行，然後在前面加上任何標籤開始前一個零寬度不可見字符。然後在TinyMCE發揮其魔力之前，這個文本稍後插入到textarea標籤之間。我不知道爲什麼，但這不會觸發問題，並且附加字符不會顯示在最終的html或TinyMCE的html視圖中，所以我可以看到使用此解決方案的唯一問題是性能受到影響。一個細節是，似乎只有開始標籤需要以這種方式預先考慮，但爲了簡單起見，我沒有考慮到這一點。

來源

2009-01-29 13:51:32

即第二示例< textarea的... />是空標記符號。如果你想要文本在裏面你需要做的第一種方式< teatarea ....> foo </textarea>

什麼是輸出textarea標籤？你可以調試，看看它是否做空標籤符號？

Eric

來源

2009-01-28 16:12:57 epascarello

問題是，TinyMCE代碼將原始文本區域修改爲單個封閉標籤。第一個代碼段是我寫的代碼，第二個代碼段是在TinyMCE修改它之後。 – 2009-01-28 16:37:22

我們最近也在使用TinyMCE。我對改變textarea的style屬性來隱藏元素感到特別困惑。很奇怪。

我很好奇你的配置文件是什麼樣子（部分爲上的配置文件的文檔：django）

UPDATE

哇...你使用TinyMCE的插件很多。當我花點時間看看我是否找不到一些可能的嫌疑人時，我會盡力進一步研究。

來源

2009-01-28 17:01:47 codemonkey

我添加了配置文件的問題。 – 2009-01-28 17:19:56

呵呵，我修改了一個默認的init文件，我確定它附帶了很多我不需要的東西，但我沒有花時間仔細觀察它。這是我第一次使用TinyMCE，所以我對它不是很熟悉。 – 2009-01-29 11:26:08

如果您不調用tinyMCE的JavaScript函數，則可能需要處理瀏覽器兼容性問題。

如果你只有在頁面上一個TinyMCE的框，你可以這樣做：

tinyMCE.activeEditor.setContent('<span>some</span>');

您還可以設置的格式，例如BB代碼。查看setContent文檔。

我會對你的PHP代碼回聲出HTML到JavaScript函數，並把它稱爲與onload：

function loadTinyMCE($html) { 
    echo " 
     <script type="text/javascript">function loadDefaultTinyMCEContent(){ 
      tinyMCE.activeEditor.setContent('$html'); 
     }</script> 
    "; 
}

然後

<body onload="loadDefaultTinyMCEContent()">

如果你不想使用該頁面onload事件，tinymce有一個名爲oninit的init選項，其功能類似。

或者，setupcontent_callback可讓您直接訪問iframe。

來源

2009-01-28 17:14:07 gradbot

假設的<p>標籤的存在導致的轉變，我懷疑你的HTML最終看起來像：

... 
<textarea id="editing_field"><p>This text is supposed to appear in the rich textbox</p></textarea> 
...

不幸的是，HTML元素並不技術上允許內部<textarea>標籤，這樣的東西，可以考慮<p>標籤作爲新塊元素的開始，隱式關閉你的textarea。爲了解決這個問題，你可以編碼尖括號：

... 
<textarea id="editing_field">&lt;p&gt;This text is supposed to appear in the rich textbox&lt;/p&gt;</textarea> 
...

使用PHP，這可以通過它呼應的頁面之前通過htmlspecialchars()發送你的價值來實現。

來源

2009-06-29 22:08:43 eswald

tinyMCE.activeEditor.setContent（ '一些'）適用於me.Cheers

來源

2010-12-22 12:20:16 kta

要改變一個特定TinyMCE的領域，你可以這樣做：

tinyMCE.get('editing_field').setContent('your default text');

來源

2016-11-07 16:50:14

我來了同樣的問題同時使用React，也許與此有關。傳遞給組件的初始值是原始值。一旦收到，組件將接管並處理內容，而不管新值是否傳遞給它。所以如果你傳遞一個字符串，那麼它是一個常量，它存在於組件的初始渲染中。但是，如果你傳遞一個變量，那麼變量的初始值可能與你想要顯示的值不同（比如它可能是null或者undefined，直到你收到要顯示的值）。在我的情況下，我收到一個包含頁面內容的對象，其中一個是要顯示爲初始內容的html。但是渲染方法首先被一個空對象觸發，然後用實際的對象觸發數據。

來源

2018-01-16 15:26:32

如何在TinyMCE textarea中設置初始文本？

回答

相關問題