Oracle APEX：富文本编辑器在 jQuery 对话框中不起作用答案

【问题标题】：Oracle APEX: Rich Text Editor won't work in jQuery dialog boxOracle APEX：富文本编辑器在 jQuery 对话框中不起作用
【发布时间】：2014-04-22 10:11:03
【问题描述】：

我正在使用 APEX 4.2.4，并尝试创建一个包含 Rick 文本编辑器 (CKEditor3) 的对话框。

我在一个区域（区域 ID：#notification）中添加了富文本编辑器字段，并将 style="display:none;" 设置为该区域。然后我有一个按钮，当点击它时，它会执行下面的 JS 代码并触发模态：

function notification() {
  var jqDialog = $('#notification').dialog(
    { modal: true,
      autoOpen: true,
      width: '500px',
      closeOnEscape: true
    });
}

当点击按钮时，模态框会正常打开，但编辑器的 iframe 是空的（无法点击并添加内容）。

如果我从模式中删除编辑器并在页面加载正常时渲染它，我会看到编辑器并且可以毫无问题地对其进行编辑。但是从我隐藏它的那一刻起（使用display:none; 或visibility:hidden;）然后使用模态显示它，它就不能再编辑了。

它不适用于 Firefox 27.0.1 和 Chrome 33.0.1750.154 m，但它适用于 IE 10 和 11。

【问题讨论】：

标签： jquery oracle modal-dialog ckeditor oracle-apex

【解决方案1】：

这很可能是一个错误，在 http://bugs.jqueryui.com/ticket/4727 中有描述。但对我来说，这个解决方案不起作用。由于顶点的性质，不可能在

标记中的 init ckeditor 文件之后立即放置 jquery-ui-dialog-patch-ckeditor.js 文件。只有一个解决方案有效：

在“页面加载时执行”区域的“页面属性”中写入：

$('#notification').dialog({
    modal: true,
    autoOpen: true,
    width: 500,
    closeOnEscape: true,
    autoOpen: false
});

然后，在您的动态操作中，在按钮的“点击”事件中，您可以重新定义对话框选项并打开对话框：

$('#notification').dialog({
    modal: true,
    autoOpen: true,
    width: 700,
    height: 400,
    closeOnEscape: true,
    autoOpen: false
});

$('#notification').dialog("open");

它适用于所有现代浏览器，包括 IE 10 和 11。

【讨论】：