将Tinymce附加到动态添加的div

时间:2016-02-28 05:31:59

标签: javascript jquery tinymce tinymce-4

我正在尝试将tinyMCE编辑器附加到动态添加的div。我使用以下代码:

$('#btnModAddChapter').bind('click', function(){

    // add dynamic div for editor
    var divEditor = "<div id='editor_2' class='editor'>";
    divEditor += "</div>";

    $('#cont').append(divEditor);

    tinyMCE.execCommand("mceAddControl", false, "editor_2");
});

但它没有将tinyMCE编辑器附加到动态添加的div。所以,为了达到这个目的,我添加了以下代码:

$(document).on('mouseover', '.editor', function(){
    tinymce.init({
        selector: '.editor',
        theme: 'modern',
        menubar: 'edit insert view table tools',
        plugins: [
          'advlist autolink link image lists charmap print preview hr anchor pagebreak',
          'searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking',
          'save table contextmenu directionality template paste jbimages textcolor'
        ],
        toolbar1: 'fontselect | fontsizeselect | insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent',
        toolbar2: 'link image jbimages print preview media fullpage | forecolor backcolor emoticons paste',
        inline: true,
        statusbar: false,
        relative_urls: false,
        theme_advanced_toolbar_location : "bottom"
    });
})

第二种方法有效,但每当我鼠标悬停在div元素上时,它都会被反复调用。如果我遗漏了任何东西,请告诉我。

由于

1 个答案:

答案 0 :(得分:0)

您可以通过在动态循环中添加TinyMCE启动代码来传递ID。

或者可以使用jquery每个函数计算textarea和app id的数量