将 DIV 内容复制到 TinyMCE答案

【问题标题】：Copy DIV contents to TinyMCE将 DIV 内容复制到 TinyMCE
【发布时间】：2013-10-03 07:44:56
【问题描述】：

我无法在 TinyMCE 编辑器中获取正确的内容。场景是这样的：管理员填写表单，表单分为 3 页（使用 jquery 切换）。他在第一页输入客户的信息（姓名、公司名称等）。最后一页他可以给他们发一封电子邮件。 TinyMCE 文本区域有前缀文本，在该文本之间，只要管理员在第一页填写姓名，我就想要客户的姓名。它适用于

$('input[name="info_name"]').change(function(){
    var info_name = this.value;
    tinyMCE.activeEditor.setContent(info_name);
});

但是没有前缀文本，因为文本必须在前缀之间。只是我想要的一个原始示例：

<div page1>
    <input name="name">blablabla</input>
</div>
<div page3>
    <textarea>
        dear $name,
        prefix text
    </textarea>
</div>

我制作了一个带有前缀内容和客户姓名的隐藏 div，以从 div 中提取全部内容，并将其插入到 TinyMCE 中，但我一直在控制台中没有“替换”方法。

$('input[name="info_name"]').change(function(){
    var info_name = this.value;
    $('span#info_name').append(this.value);
    var mailcontent = $('div#message-hidden').val;
    tinyMCE.activeEditor.setContent(mailcontent);
});

有人吗？

【问题讨论】：

标签： javascript jquery html forms tinymce

【解决方案1】：

假设你的 HTML 是

<p><input type="text" name="first_name" class="test" /></p>

<textarea>Your content here.</textarea>

<div class="dummy">Your __NAME__ here!</div>

当文本输入发生变化时，此 JS 将设置活动 TinyMCE 编辑器的内容

tinymce.init({selector:'textarea'});

$(document).on('change', $('input.test'), function(){
   dummy_html = $('div.dummy').html();
   editor_content = dummy_html.replace("__NAME__", $('input.test').val());
   tinymce.activeEditor.setContent(editor_content);
});

这里的工作示例http://fiddle.jshell.net/4n3Cr/

【讨论】：