如何在TinyMCE textarea中设置初始文本? [英] How to set the initial text in a TinyMCE textarea?

查看:427
本文介绍了如何在TinyMCE textarea中设置初始文本?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我处于一种奇怪的境地,我之前没有遇到任何问题,实现了我正在寻找的东西。以下代码是HTML页面的一部分,用于托管TinyMCE富文本框:

I'm in a curious situation where I previously had no problem achieving what I'm looking for. The following code is a part of an HTML page which is to host a TinyMCE rich textbox:

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

首先,这是按预期工作,创建一个带有随附内容的富文本框其中的文字。但是,在某些时候,TinyMCE代码决定将textarea HTML转换为以下内容:

At first this worked as intended, creating a rich textbox with the enclosed text in it. At some point, though, the TinyMCE code decided that the textarea HTML should be transformed to the following:

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

这会在文本框下方呈现文本这不完全理想。我不知道是什么导致了这种行为的改变,虽然我也在使用jQuery,如果这可能有任何影响。

This renders the text below the textbox which is not exactly ideal. I don't have a clue what caused this change of behavior, though I'm also using jQuery along with it if that could have any effect.

我可以解决通过使用ajax或通过隐藏HTML中的文本并移动它,在页面加载后使用javascript将内容加载到文本框中的问题。但是,如果可能的话,我想直接从PHP中将文本发送到文本框中。任何人都知道这里发生了什么以及如何解决它?

I can work around the problem by loading content into the textbox with javascript after the page has loaded, either by using ajax or by hiding the text in the HTML and just moving it. However, I would like to emit the text into the textbox directly from PHP if at all possible. Anyone knows what is going on here and how to fix it?

更新2:我已经成功地重现了导致行为改变的情况:首先,我在textarea中只有第一个代码片段中的纯文本。但是,在保存内容后,文字将如下所示:

Update 2: I have succesfully reproduced the situattion which causes the change of behavior: At first I just had plain text in the textarea as in the first code snippet. However, after saving the content the text would look like this:

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

p 标签的存在会导致TinyMCE触发封闭的textarea与textarea之间的转换,这只是一个标签(如上图所示)。

The presence of the p tag causes TinyMCE to trigger the transformation between an enclosing textarea to a textarea which is just a single tag (as illustrated above).

更新1:添加了TinyMCE配置文件:

Update 1: added TinyMCE config file:

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"
    });


推荐答案

看来我已经解决了问题,除非那里是任何破坏解决方案的边缘案例。在将其保存到数据库之前,我在页面内容上使用以下PHP代码:

It appears that I have solved the problem, unless there are any edge cases which ruins the solution. I use the following PHP code on page content before I save it to the database:

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

它的作用是删除所有换行符,然后在任何开始标记之前添加零宽度不可见字符。然后,在TinyMCE发挥其魔力之前,将此文本插入到textarea标签之间。我不知道为什么,但这不会触发问题,并且附加的字符没有显示在最终的html或TinyMCE的html视图中,因此我可以看到这个解决方案的唯一问题是性能损失。一个细节是看起来只有开始标签需要以这种方式预先添加,但为了简单起见,我在这里没有考虑到这一点。

What it does is it removes any newlines and then prepend a zero-width invisible character before any beginning tag. This text is then later inserted between the textarea tags before TinyMCE does its magic. I don't know why but this does not trigger the problem and the appended characters are not shown in the final html or in the html view of TinyMCE, so the only problems I can see with this solution is the performance hit. A detail is that it appears only the start tags need to be prepended in this way, but I haven't taken this into consideration here, for simplicity.

这篇关于如何在TinyMCE textarea中设置初始文本?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆