如何确保ckeditor在jquery-ui对话框小部件中显示时具有焦点

Question

我使用CKEDITOR.appendTo( "my_div" , null , my_string )创建了一个ckeditor实例......没问题。

但是，LINK按钮会打开一个非交互式LINK对话框。

那么，是否有一些配置设置，它应该手动设置为true，也许？

---

编辑1 ...我将解释非交互式LINK对话框的含义 ...

当我点击ckeditor的LINK按钮（看起来像链接的按钮）时，它会打开一个LINK对话框，其中有一个输入字段供我输入URL，另外还有一个下拉选择协议，另外还有一对其他形式的元素。

但是，这些都不可用......如果我尝试输入url输入字段，则没有任何反应（该字段将不接受焦点）;同样，如果点击它们，下拉不会打开。

---

编辑2 ...添加了屏幕截图

Answer 1

当对话框的模态选项设置为true时，该对话框将阻止与其外部元素的任何交互。 （https://github.com/jquery/jquery-ui/blob/master/ui/dialog.js#L818）

您可以覆盖它以允许与ckeditor内的元素进行交互。

只需在jquery ui之后将其包含在内，它应该可以工作：

orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
$.ui.dialog.prototype._allowInteraction = function(event) {
  if ($(event.target).closest('.cke_dialog').length) {
    return true;
  }
  return orig_allowInteraction.apply(this, arguments);
};

如果您想允许与对话框外的任何元素进行交互，请改为包含此内容：

$.ui.dialog.prototype._allowInteraction = function(event) {
  return true;
};

Answer 2

添加：

$(document).on('focusin', function(e) {e.stopImmediatePropagation();});

Answer 3

我正在使用：

• 的jquery-1.8.2

• 的jquery-UI-1.10.3

• ckeditor 4.3.1

然后我将 jquery-ui-1.10.3 替换为： jquery-ui-1.9.0 ，它似乎按预期工作。

---

如果回到jquery-ui 1.9对你不好，还要看看：

• jquery-ui forum ...“无法在jQuery UI模式对话框中编辑CKEditor的字段”

• jquery-ui bugs ...“对话：模态对话框中的CKEditor不可编辑”