Предварительный просмотр стороны tinyMCE content

Question

Мне нужно показать предварительный просмотр в прямом эфире на той же странице. Мне нужно показать смешивание содержимого других входных значений с содержимым внутри текстовой области tinyMCE в боковом div, поскольку пользователь форматирует текст или изменяет другие входные значения (текст/выбор/флажок и т. Д.).

Кто-нибудь даст мне направление для реализации этого?

Проверьте https://app.classeur.io/#!/files/zvbiZEbizyUHb2aUS9xP и нажмите ссылку «Предварительный просмотр», чтобы увидеть поведение, которое мне нужно для tinyMCE.

Answer 1

В принципе я реализовал с помощью change и keyup события, предоставляемые TinyMCE

Вот фрагмент конфигурации.

tinyMCE.init({ 
     selector: "textarea.tinymce", 
     toolbar: ["undo redo | bold italic | styleselect | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent","link image media | code"], 
     plugins: "image imagetools link paste media code", 
     setup: function(ed) { 
     ed.on('change', function(e) { 
      previewContent(ed.getContent()); 
     }); 

     ed.on('keyup', function(e) { 
      previewContent(ed.getContent()); 
     }); 
     } 
});