我希望能够抓住CKeditor中的图像对话框时,从URL文本输入字段获取onfocus事件。劫持CKeditor输入字段
我试着为元素(id#cke_75_textInput)添加一个事件处理程序,但它只在点击了Image按钮后才出现在DOM中。
查看了CKEditor 3 JavaScript API文档,在这里,我一直在挣扎,找不到我需要的东西。
这可以通过API来完成吗?
我希望能够抓住CKeditor中的图像对话框时,从URL文本输入字段获取onfocus事件。劫持CKeditor输入字段
我试着为元素(id#cke_75_textInput)添加一个事件处理程序,但它只在点击了Image按钮后才出现在DOM中。
查看了CKEditor 3 JavaScript API文档,在这里,我一直在挣扎,找不到我需要的东西。
这可以通过API来完成吗?
有没有必要做一些魔术焦点代表团(这是一个混乱,因为重点没有泡沫)。只需使用CKEditor API:
CKEDITOR.on('dialogDefinition', function(evt) {
if (evt.data.name == 'image') {
var def = evt.data.definition;
var onShow = def.onShow;
def.onShow = function() {
onShow && onShow.apply(this, arguments);
var input = this.getContentElement('info', 'txtUrl');
console.log(input.getValue());
input.on('focus', function() {
console.log('focused');
});
};
}
});
PS。 CKE4的文档比老CKE3的文档更少 - http://docs.ckeditor.com/#!/api/CKEDITOR.dialog
这非常出色,但需要一些工作才能看到你从文档中得到了什么。 – Galadai 2013-05-11 17:35:59
每个CKEditor包中都有一个[dialog API sample](http://ckeditor.com/latest/samples/plugins/dialog/dialog.html),[示例插件指南](http://docs.ckeditor.com/ #!/ guide/plugin_sdk_sample_1)以及我在答案中链接的API文档。它需要一些时间来编译所有这些,但所有这些都在官方文档中。我的答案中唯一棘手的部分是如何获取对话框实例。我重写了对话框定义的'onShow'方法,但我认为更简单的解决方案可能(或应该)存在。 – Reinmar 2013-05-11 18:30:26
您不会碰巧使用jQuery,对不对?它可以帮助将该事件与代表团进行绑定。基本的JavaScript将会有更多的问题,因为焦点事件冒泡问题 – Ian 2013-05-10 13:32:30
看看[关于quirksmode的这篇小文章](http://www.quirksmode.org/blog/archives/2008/04/delegating_the .html)关于捕获'focus','change'和其他非冒泡事件。除非你可以使用jQuery,否则这将是我的建议。 – Kiruse 2013-05-10 13:34:05
我正在使用jQuery。这是如何使它更容易? – Galadai 2013-05-10 14:30:27