TinyMCE，将HTML插入特定的TinyMCE实例

Question

我在一个页面上使用了多个TinyMCE编辑器，我需要在特定的编辑器中插入HTML，但是当前当我插入HTML时，它会插入到最后一个编辑器中。

我的初始化代码：

<script type="text/javascript">
$(document).ready(function() {

    // enable tinyMCE on shortDescription
    tinymce.init({
        mode : "exact",
        elements :"shortDescriptionHtml",
        plugins: [
            "advlist autolink lists link image charmap print preview anchor",
            "searchreplace visualblocks code fullscreen",
            "insertdatetime media table contextmenu paste"
        ],
        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
        relative_urls : false,
        remove_script_host : false
    });

    // enable tinyMCE on fullDescription
    tinymce.init({
        mode : "exact",
        elements :"fullDescriptionHtml",
        plugins: [
            "advlist autolink lists link image charmap print preview anchor",
            "searchreplace visualblocks code fullscreen",
            "insertdatetime media table contextmenu paste"
        ],
        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
        relative_urls : false,
        remove_script_host : false
    });

    // enable tinyMCE on Terms And Conditions
    tinymce.init({
        mode : "exact",
        elements :"termsAndConditionsHtml",
        plugins: [
            "advlist autolink lists link image charmap print preview anchor",
            "searchreplace visualblocks code fullscreen",
            "insertdatetime media table contextmenu paste"
        ],
        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
        relative_urls : false,
        remove_script_host : false      
    });

});
</script>

现在当我尝试去做

tinyMCE.execCommand('mceInsertContent',false,'<img src="'+imgsrc+'" />');

它将图像插入到最后一个TinyMCE编辑器中，即条款和条件编辑器中，我如何将该图像插入到第一个或第二个TinyMCE编辑器中？

- Jan Vladimir Mostert

Answer 1

您需要获取编辑器的特定实例。我猜，类似这样：tinymce.get($(el).attr('id'));？

请查看此链接：http://jsfiddle.net/svCp2/。代码行如下：

tinymce.get('c3').setContent('sdf');

- Ivan Demchenko

---

这对我有用： tinymce.get($("#fullDescriptionHtml").attr('id')).execCommand('mceInsertContent',false,'<img src="'+imgsrc+'" />');感谢您的快速回答！ - Jan Vladimir Mostert

好的。但是使用getElementById访问元素id的原因是什么呢？我的意思是 $("#fullDescriptionHtml").attr('id') = #fullDescriptionHtml :) - Ivan Demchenko

没错，这个完美地运行了。已经有5年没写JavaScript了，所以有点生疏 :-) tinymce.get("fullDescriptionHtml").execCommand('mceInsertContent',false,'<img src="'+imgsrc+'" />'); - Jan Vladimir Mostert

棒极了！很不错的方法 :) - Ivan Demchenko

Answer 2

tinymce.get("editorID").execCommand(
    'mceInsertContent',
    false,
    '<img src="'+imgsrc+'" />'
);

其中 "editorID" 是您的编辑器 ID 选择器

<div id="editorID">...</div>

- Mladen Janjetovic

Answer 3

使用activeEditor对象：

tinyMCE.activeEditor.execCommand('mceInsertContent',false,'<img src="'+imgsrc+'" />');

- Brian Richwine