动态填充TinyMCE内容中的div

Question

我正在尝试从TinyMCE textarea获取内容，以便在我输入时填充按钮/ div。这是为了向客户端显示按钮/ div在其上线时的外观。其他一切都是动态的，比如按钮/ div颜色，标题和下拉列表。

问题在于从TinyMCE动态检索内容。如果我使用标准textarea盒子它工作正常。我希望客户能够使用TinyMCE的一些基本功能。

此表单字段的工作方式。当我在这个框中输入时，我可以在下面看到我的文本更新。

我的JS是：

$(document).on('change', '#ParentID', function() {
    var NTxt = $('#ParentID option:selected').text();
    var NVal = document.getElementById("ParentID").value;
    NTxt = NTxt.replace(/ @ /g,"<br/>");
    if(NVal != "0"){
        if(NTxt.value != null || NTxt.value != "0" || NTxt.value != undefined){
        $("#LTxt").html(NTxt);
        }
    }else{
        $("#LTxt").html('External Link Text/Quote Text');
    }
});
$(document).on('keyup', '#Opt2', function() {
   $('#LTxt').text($(this).val());
});

以下是一些屏幕抓取：

1。正常状态：

的 2。填充标题和下拉列表“内部链接”文字：

第3。 Textarea，填充相同的地方（没有TINYMCE）：

有人知道如何用TinyMCE做到这一点吗？我试过......

tinymce.get('content id').getContent()

...但它似乎没有动态填充。

这是关键问题：如何将输入TinyMCE textarea的内容传递到底部的按钮，就像用户输入一样？

非常感谢，

格林

Answer 1

您需要使用TinyMCE触发的各种事件来了解其内容何时发生变化。然后，您可以从编辑器中获取内容，并使用它执行任何操作。

以下示例显示了相邻DIV中的实际原始HTML。它可以很容易地适用于将HTML插入到元素中，以便实际呈现给页面。

http://fiddle.tinymce.com/Gegaab/5

此处记录了可用事件列表：https://www.tinymce.com/docs/advanced/events/#editorevents

该示例特别使用keydown和change事件，但如果这些事件不符合您的需求，还有很多可供选择。