javascript - tiniMCE 不在 jsPanel 中初始化

标签 javascript jquery tinymce

我使用 jsPanel 在我的网站上显示某种模式窗口。

在 jsPanel 初始化中,我使用文本区域和回调函数指定内容。

创建 jsPanel 后,我尝试在回调中初始化tinyMCE。我测试tinyMCE实例,我的编辑器位于实例列表中...但在jsPanel中,它显示为普通文本区域,而不是tinyMCE。

有什么想法吗? 这是代码:

function oninitjspanel()
{
    console.log('before init modal mce');
    tinymce.init({
        selector: "#email_message",
        entity_encoding : "raw",
        encoding: "UTF-8",
        theme: "modern",
        height: "100%",
        width: "100%",
        plugins: [
        "advlist autolink lists link image charmap print preview hr anchor pagebreak",
        "searchreplace wordcount visualblocks visualchars code fullscreen",
        "insertdatetime media nonbreaking save table contextmenu directionality",
        "emoticons template paste textcolor colorpicker textpattern"
        ],
        toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image preview media | forecolor backcolor emoticons",
        image_advtab: true,
    });
    console.log('after init modal mce');
    for (var i = 0; i < tinymce.editors.length; i++)
    {
        console.log(i + " Editor id:", tinymce.editors[i].id);
    }  
}

$('#new_document').click (function () {
    var content = '<div id="choix_document"><textarea id="email_message"></textarea></div>';                
    $.jsPanel({
        content:        content,
        position:       "center",
        theme:          "success",
        title:          "Nouveau document/email",
        size:           {   width:  function(){ return $(window).width()*0.75 }, 
                            height: function(){ return $(window).height()*0.75 } },
        toolbarFooter:  "<div class='email_submit'>Envoyer email</div><div id='email_returnmessage'></div>",
        callback:       oninitjspanel(),
    });

});

控制台日志:

before init modal mce
after init modal mce
0 Editor id: model_editor
1 Editor id: email_message

编辑:还有一件事,由于tinyMCE在模态中存在焦点问题,我在页面上应用加载以下内容来防止出现问题:

$(document).on('focusin', function(e) {
    if ($(e.target).closest(".mce-window, .moxman-window").length) {
        e.stopImmediatePropagation();
    }
});

最佳答案

看看 https://github.com/Flyer53/jsPanel/issues/51

但我猜你是在 GitHub 的 jsPanel 问题页面上提出同样问题的人?

关于javascript - tiniMCE 不在 jsPanel 中初始化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34066255/

相关文章:

jquery - 使用 jquery 将 div 中心对齐在其他 div 的前面

javascript - HTML 页面中的 VML/SVG 编辑器

javascript - 如何在 Ext Js 4 中设置 TinyMce 编辑器的高度?

javascript - 读取动态生成的文本框

javascript - ng-show 不适用于 bool 值

javascript - 我如何在 jQuery 插件中返回一个子集?

jquery - 填充剩余垂直空间的第二个元素

JavaScript 通过名称获取元素

javascript - 如果当前通过键盘上的 Tab 键选择某个元素,如何将其触发到 'click'?

javascript - TinyMCE - window.blur 函数在编辑器焦点上触发