JQuery模态中的TinyMCE模态不可编辑答案

【问题标题】：TinyMCE modal in JQuery modal not editableJQuery模态中的TinyMCE模态不可编辑
【发布时间】：2013-06-24 09:00:29
【问题描述】：

我在 JQuery UI 模式对话框中运行 tinyMCE 编辑器。一切正常，除了 tinyMCE 本身打开新模式的那些功能（例如链接）。这些模态显示很好，但输入区域不可编辑。根据 Firebug 的 js 代码是可以的，并且 HTML 非常简单。

任何线索可能来自哪里？

编辑：

<script type="text/javascript">
tinymce.init({
    selector: "textarea",
    plugins: "autolink link table textcolor",
    menubar: false,
    toolbar: "undo redo | styleselect | forecolor backcolor | bold italic | link unlink | table"
});
$(document).ready(function(){
    $(".sendmail")
        .button({
            icons: {
                primary: "ui-icon-mail-closed"
            },
            text: false
        })
        .click(function(){
            $("#sendmailform").dialog("open");
        })
    ;
    $(function(){
        $("#sendmailform")
            .dialog({
                autoOpen: false,
                title: "Send mail confirmation",
                modal:true,
                width: 750,
                [buttons & ajax]
            })
        ;
    });
});
</script>

【问题讨论】：

标签： jquery tinymce modal-dialog

【解决方案1】：

来自http://www.tinymce.com/develop/bugtracker_view.php?id=5917

对于 jQuery UI 对话框，您可以这样做：

$.widget("ui.dialog", $.ui.dialog, {
    _allowInteraction: function(event) {
        return !!$(event.target).closest(".mce-container").length || this._super( event );
    }
});

【讨论】：

非常感谢您提供链接。赞成，但不是解决方案-将其发布在下面的答案中:)
经过相当多的发展，这两种解决方案似乎都取决于上下文。我发布的那个在大多数页面上都有效，但在其中一个页面上不断抛出“事件未定义错误”。我用上面的代码替换了我的代码，它有效。
这在页面上有嵌套对话时有效。为什么这不是默认内置在tinymce中的？！

【解决方案2】：

感谢@Harry，TinyMCE bugtracker 上的好人提供了解决方案。

我刚刚在 DOM 之后加载的脚本顶部添加了以下代码，就在加载 tinyMCE 之前：

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

就像一个魅力，而@Harry 发布的那个却没有。

【讨论】：

【解决方案3】：

您的问题需要更详细的回答，但您可以试试这个：

tinymce.get('editor_id').getBody().setAttribute('contenteditable', 'false');

【讨论】：

这将如何解决 OP 的问题？