如何设置一个TinyMCE的textarea的初始文本？

StackOverflow https://stackoverflow.com/questions/488189

  •  20-08-2019
  •  | 
  •  

题

我在一个奇怪的情况，我以前有没有问题，达到什么我要找的。以下代码是一个HTML页的一部分，其是举办TinyMCE的丰富文本框：

...
<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：我已成功再现这引起性能变化的situattion：首先我不得不在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"
    });
有帮助吗？

解决方案 6

看来，我已经解决了这个问题，除非有任何边缘情况，其破坏了解决方案。我使用的页面内容下面的PHP代码之前，我将它保存到数据库中：

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

它的作用是它消除任何新行，然后在前面加上任何开始标记前面零宽度不可见字符。该文本后来textarea的标签之间插入TinyMCE的做它的魔力了。我不知道为什么，但问题并附加字符不会在最终的HTML或在TinyMCE中的HTML视图中显示这不会触发，这样我就可以用此溶液看到的唯一问题是对性能的影响。一个细节是，它似乎只是一个开始标签必须以这种方式预先考虑，但我还没有考虑到这一点在这里，为了简单起见。

其他提示

如果你不叫了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 该功能类似于。

可替换地， setupcontent_callback 使您的IFRAME直接访问。

鉴于<p>标签的存在使得改造

，我怀疑你的HTML最终看起来像：

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

不幸的是，HTML元素并不技术上允许<textarea>标签里面，这样的东西，可以考虑<p>标签作为一种新的块元素的开始，含蓄地关闭您的文字区域。为了解决这个问题，可以编码尖括号：

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

使用PHP，这可以通过它呼应的页面之前发送至htmlspecialchars()你的价值来实现。

这第二个例子中是空标记符号。如果你想要的文字是踏歌里面，你需要做这样的第一种方式富的

什么正在输出textarea的标记？你可以调试，看看它是否是做的空标记符号？

埃里克

tinyMCE.activeEditor.setContent（ '一些'）适用于me.Cheers

我们在这里使用了TinyMCE的最近也是如此。我感到特别困惑关于改变textarea的隐藏元素的样式属性。很奇怪的。

我很好奇你的配置文件是什么样子（部分为上的配置文件的文档： Django的）

UPDATE

哇...你使用TinyMCE的插件很多。我会尝试进一步研究时，我得到了一段时间，看看我能不能找出一些可能的嫌疑人。

我来了同样的问题，而使用反应，也许这是与此有关。传递到组件的初始值是原始值。一旦收到，该组件将接管和处理的内容，无论新值是否传递给它。所以，如果你传递一个字符串，那么它是一个常数，它存在于初始渲染您的组件。但是，如果你传递一个变量，它有可能是变量的初始值是要显示（如它可能null或undefined，直到收到显示的值）的值不同。在我的情况下，我接收的对象与页面内容，其中之一是，以显示作为初始内容的HTML。但是render方法首先被用一个空对象烧制，然后与数据的实际对象。

在tinyMCE.init设置 - 

init_instance_callback: function (editor) {
                AFunction();
            }

function AFunction(){
//your code here
tinyMCE.get('youtinytextareaname').setContent("your text here");
}

要更改特定TinyMCE的字段，就可以做到这一点：

tinyMCE.get('editing_field').setContent('your default text');
不隶属于 StackOverflow
scroll top