Как установить исходный текст в текстовой области TinyMCE? - PullRequest
Новая
       12

Как установить исходный текст в текстовой области TinyMCE?

10 голосов
/ 28 января 2009

Я нахожусь в любопытной ситуации, когда раньше у меня не было проблем с достижением того, что я ищу. Следующий код является частью HTML-страницы, на которой размещается текстовое поле TinyMCE: 

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

Сначала это работало как задумано, создавая расширенное текстовое поле с вложенным текстом в нем. Однако в какой-то момент код TinyMCE решил, что текстовая область HTML должна быть преобразована в следующее: 

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

Это делает текст под текстовым полем не совсем идеальным. Я понятия не имею, что послужило причиной этого изменения поведения, хотя я также использую jQuery вместе с ним, если это может иметь какой-либо эффект.

Я могу обойти эту проблему, загружая содержимое в текстовое поле с помощью javascript после загрузки страницы, либо используя ajax, либо скрывая текст в HTML и просто перемещая его. Тем не менее, я бы хотел выводить текст в текстовое поле напрямую из PHP, если это вообще возможно. Кто-нибудь знает, что здесь происходит и как это исправить?

Обновление 2: Я успешно воспроизвел ситуацию, которая вызывает изменение поведения: сначала у меня был простой текст в текстовой области, как в первом фрагменте кода. Однако после сохранения содержимого текст будет выглядеть так: 

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

Присутствие тега p заставляет TinyMCE инициировать преобразование между вмещающей текстовой областью в текстовую область, которая является просто одним тегом (как показано выше).

Обновление 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"
    });

Ответы [ 9 ]

15 голосов
/ 28 января 2009

Если вы не вызываете функцию tinyMCE для JavaScript, возможно, вам придется столкнуться с проблемами совместимости браузера.

Если на странице есть только один прямоугольник, вы можете просто сделать это: 

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

Вы также можете установить формат, такой как BBCode. Ознакомьтесь с документацией 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.

2 голосов
/ 30 июня 2009

Учитывая, что наличие <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(), прежде чем отобразить его на странице.

1 голос
/ 22 декабря 2010

tinyMCE.activeEditor.setContent ('some') работает для меня. Приветствия

1 голос
/ 28 января 2009

Второй пример

Что выводит теги textarea? Можете ли вы отладить это, чтобы увидеть, выполняет ли оно нотацию пустого тега?

Эрик

0 голосов
/ 05 августа 2018

установлено в tinyMCE.init - 

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

function AFunction(){
//your code here
tinyMCE.get('youtinytextareaname').setContent("your text here");
}
0 голосов
/ 16 января 2018

Я столкнулся с той же проблемой при использовании React, возможно, это связано с этим. Начальное значение, переданное компоненту, является исходным значением. После получения компонент перехватывает содержимое и обрабатывает его независимо от того, передано ли ему новое значение. Так что если вы передаете строку, то это константа, и она существует при начальном рендеринге вашего компонента. Но если вы передаете переменную, возможно, что начальное значение переменной отличается от значения, которое вы хотите отобразить (например, оно может быть нулевым или неопределенным, пока вы не получите значение для отображения). В моем случае я получаю объект с содержимым страницы, одним из которых является HTML для отображения в качестве исходного содержимого. Но метод рендеринга сначала вызывался с пустым объектом, а затем с реальным объектом с данными.

0 голосов
/ 07 ноября 2016

Чтобы изменить определенное поле tinymce, вы можете сделать это: 

tinyMCE.get('editing_field').setContent('your default text');
0 голосов
/ 29 января 2009

Похоже, что я решил проблему, если нет каких-либо крайних случаев, которые разрушают решение. Я использую следующий код PHP для содержимого страницы перед сохранением в базе данных: 

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

Что он делает, так это удаляет все новые строки, а затем добавляет любой невидимый символ нулевой ширины перед любым начальным тегом. Этот текст затем вставляется между тегами textarea, прежде чем TinyMCE сделает свое волшебство. Я не знаю почему, но это не вызывает проблемы, и добавленные символы не отображаются в конечном html или html-представлении TinyMCE, поэтому единственные проблемы, которые я вижу в этом решении, - это снижение производительности. Деталь в том, что, похоже, таким образом нужно начинать только начальные теги, но я не учел это здесь для простоты.

0 голосов
/ 28 января 2009

Мы также используем TinyMCE в последнее время. Я особенно озадачен изменением атрибута стиля текстовой области, чтобы скрыть элемент. Очень странно.

Мне интересно, как выглядит ваш файл конфигурации (некоторая документация по файлам конфигурации: django )

UPDATE

вау ... вы используете МНОГО крошечных плагинов. Я попытаюсь провести дальнейшие исследования, когда у меня будет время, и посмотреть, не смогу ли я выяснить вероятных подозреваемых.

...