在CKFinder对话框中使用jQuery

在CKFinder 2对话框中是否存在使用jQuery和jQuery插件的方法？我只想使用Jcrop来裁剪我插件中的图像。 例如，下面的代码不起作用<代码>jQuery（document）.ready（…）事件很好地触发，但在它里面我无法选择对话框的任何元素。那么，有可能吗

CKFinder.dialog.add("ImageCroppingDialog", function (api) {
return {
    title: "Test",
    minWidth: 480,
    minHeight: 750,
    onShow: function () {
        var file = api.getSelectedFile();
        var url = file.getUrl();
        var doc = this.getElement().getDocument();
        var img = doc.getById('cropbox');
        img.setAttribute('src', url);
        jQuery(document).ready(function () {
            jQuery('#cropbox').Jcrop();
        });
    },
    contents: [
            {
                id: 'tab1',
                label: '',
                title: '',
                expand: true,
                padding: 0,
                elements: [
                        {
                            type: 'html',
                            html: '<h3>Select area to crop.</h3><img id="cropbox" src="" style="max-width: 480px; max-height: 580px;"></img>'
                                    + '<script type="text/javascript" src="../Scripts/jquery-1.5.1.min.js"></script>'
                                    + '<script type="text/javascript" src="../Scripts/crop/jquery.jcrop.min.js"></script>'
                        }
                ]
            }
        ],
    buttons: [CKFinder.dialog.cancelButton, CKFinder.dialog.okButton]
};
});

CKFinder.addPlugin('ImageCropper', function (api) {

api.addFileContextMenuOption({ label: 'Crop image', command: "ImageCropper" }, function (api, file) {
    api.openDialog("ImageCroppingDialog");
    if (!file.isImage()) {
        api.openMsgDialog("Image cropping", "This feature is only available for editing images.");
        return;
    } //end check if isImage()
});

});

CKFinder.dialog.add（“ImageCroppingDialog”，函数（api）{
返回{
标题：“测试”，
最小宽度：480，
身高：750，
onShow:function（）{
var file=api.getSelectedFile（）；
var url=file.getUrl（）；
var doc=this.getElement（）.getDocument（）；
var img=doc.getById（'cropbox'）；
setAttribute（'src'，url）；
jQuery（文档）.ready（函数（）{
jQuery（'#cropbox'）.Jcrop（）；
});
},
内容：[
{
id:'表1'，
标签：“”，
标题：“”，
是的，
填充：0，
要素：[
{
键入：“html”，
html:“选择要裁剪的区域。”
+ ''
+ ''
}
]
}
],
按钮：[CKFinder.dialog.cancelButton，CKFinder.dialog.okButton]
};
});
CKFinder.addPlugin（'ImageCropper'，函数（api）{
addFileContextMenuOption（{label:'Crop image'，command:'ImageCropper}，函数（api，文件）{
openDialog（“ImageCroppingDialog”）；
如果（！file.isImage（））{
openMsgDialog（“图像裁剪”，“此功能仅可用于编辑图像”）；
返回；
}//如果isImage（）结束检查
});
});

有一种集成了jQuery的ckEditor。如果无法切换到该版本，则有多种方法可以将jQuery对象传递到CKFinder对象，其中最简单的方法是：

CKFinder.prototype.J = jQuery;

有一个包含jQuery集成的ckEditor。如果无法切换到该版本，则有多种方法可以将jQuery对象传递到CKFinder对象，其中最简单的方法是：

CKFinder.prototype.J = jQuery;

---

我注意到CKFinder使用的是iFrame，混淆了jquery选择器

你应该像这样试试

$("#cropbox", $("iframe:first").contents());

---

我注意到CKFinder使用的是iFrame，混淆了jquery选择器

你应该像这样试试

$("#cropbox", $("iframe:first").contents());