在AJAX扩展弹出中包括TinyMCE

Question

我在让TinyMCE正常工作方面遇到了一些困难，请看下面的截图，忽略CSS问题。

我的问题是，当我第二次打开弹出时，编辑器就不会加载。

我找到了这篇文章，这正是我遇到的问题，但是使用Fancybox -我尝试使用没有joy提供的解决方案。

有人能说点什么吗？

初始化TinyMCE

jQuery(document).ready(function() {
    jQuery('#personalise_html_body').tinymce({
        // Location of TinyMCE script
        script_url : '/core-js/tinymce/4.0.28/tiny_mce.js',
        theme_url: '/core-js/tinymce/4.0.28/themes/modern/theme.js',
        skin_url: '/core-js/tinymce/4.0.28/skins/lightgray',

            // General options
        language : \"".strtolower($lang)."\",
        theme : \"modern\",
        plugins:  [
            \"textcolor code fullscreen link paste preview moxiemanager\"
        ],
        moxiemanager_title: \"{_T_MEDIA_MANAGER_TITLE}\",
        menubar : false,
        toolbar: [
        \"bold italic underline | alignleft aligncenter alignright alignjustify | formatselect fontselect fontsizeselect |\",
        \"cut copy paste | numlist bullist | undo redo | link unlink  | forecolor backcolor |  insertfile | code preview | fullscreen\"
        ],
        convert_urls: false,

    });
});

，我尝试在我的扩展弹出代码中添加回调(这里的想法是：TinyMCE & Fancybox - editor won't work on 2nd view)，但没有成功：

$('a.personalise').magnificPopup({
        type: 'ajax',
    callbacks: {
        open: function() {
                tinyMCE.execCommand('mceToggleEditor', false, 'personalise_html_body');
        tinyMCE.execCommand('mceAddControl', false, 'personalise_html_body');
            },
        close: function() {
                tinyMCE.execCommand('mceFocus', false, 'personalise_html_body');
                tinyMCE.execCommand('mceRemoveControl', true, 'personalise_html_body');
        }
    }
});

Answer 1

这是使用以下代码解决的。

总是简单的事情..。

$('a.personalise').magnificPopup({
    type:       'ajax',
    callbacks:  {
        close: function() {
            tinymce.remove('#personalise_html_body');
        }
    }
});

Answer 2

我找到了以下解决方案，当您单击obeh时，应该会导致弹出开销重新初始化TinyMce。

function initTiny(){
    setTimeout(function(){
        tinymce.remove(".js-tiny-mce");
        tinymce.init({
            selector: '.js-tiny-mce',
            menubar: false,
            toolbar: [
                'undo redo | bold italic underline | bullist numlist outdent indent'
            ]
        });
    },50); 
}