我需要将 elFinder 集成到 CKEditor。我跟着这个:
https://github.com/Studio-42/elFinder/wiki/Integration-with-CKEditor
它工作正常,但打开用于图像选择的弹出窗口不是很好,所以我想在模式对话框中打开 elFinder。
对于“模态集成”,我遵循了这个线程: http://bxuulgygd9.tal.ki/20110728/integration-with-ckeditor-759177/
那里的最后一篇文章部分有效。它确实以模式打开 elfinder。但: 当我想在 CKFinder 中将图像 URL 插入到 URL 字段时,我必须知道它的确切 ID。也没有填充图像分辨率并带来一些其他问题。最好的解决方案是运行在“普通弹出窗口”集成中调用的函数,它会处理所有事情:
window.opener.CKEDITOR.tools.callFunction(funcNum, file);
但在“弹出集成”中,注册了funcNum回调,在模态集成中没有,所以我无法调用它。你有什么提示可以在模式窗口中运行 elfinder(或任何其他图像管理器 - 它会相同)吗?我很绝望。
最佳答案
我自己解决了。此代码是多个教程的组合,允许将 elFinder 完全集成到模式窗口中。也许有人会认为它有用。
CKEDITOR.on('dialogDefinition', function(event) {
var editor = event.editor;
var dialogDefinition = event.data.definition;
console.log(event.editor);
var dialogName = event.data.name;
var tabCount = dialogDefinition.contents.length;
for (var i = 0; i < tabCount; i++) {
var browseButton = dialogDefinition.contents[i].get('browse');
if (browseButton !== null) {
browseButton.hidden = false;
browseButton.onClick = function(dialog, i) {
editor._.filebrowserSe = this;
jQuery('<div \>').dialog({modal: true, width: "80%", title: "Insert image", zIndex: 99999,
create: function(event, ui) {
jQuery(this).elfinder({
resizable: false,
url: "/path/to/connector.php",
getFileCallback: function(url) {
CKEDITOR.tools.callFunction(editor._.filebrowserFn, url);
jQuery('a.ui-dialog-titlebar-close[role="button"]').click()
}
}).elfinder('instance')
}
})
}
}
}
});
关于javascript - 模态对话框中的 CKEditor 和 elFinder,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16466706/