首页 文章

CKEditor - 将图像拖放到 Headers 图像中

提问于
浏览
2

我正在使用CKEditor 4.5的拖放功能,它非常酷,但是当图像成功上传时,它并不像我想的那样出现 . 我希望图像直接显示为增强图像插件中的 Headers 图像,而不必双击图像并选择 Headers 图像 .

我已经看到了这个答案CKEditor 4.5 drag and drop image upload - how to return new dimensions in json response?但是我想知道我们是否可以在JSon响应中精确设置一个小部件,这样图像就会像我们想要的那样被格式化 .

或者,如上面链接的答案,我应该覆盖onUploaded以匹配 Headers 图像的格式?

1 回答

  • 3

    是的,您可以像这样覆盖 onUploaded

    editor.on( 'instanceReady', function() {
        editor.widgets.registered.uploadimage.onUploaded = function( upload ) {
            this.replaceWith( '<figure class="image">' +
                '<img src="' + upload.url + '" ' +
                'width="' + this.parts.img.$.naturalWidth + '" ' +
                'height="' + this.parts.img.$.naturalHeight + '">' +
                '<figcaption>Your caption</figcaption>' +
                '</figure>' );
        };
    } );
    

    onUploadedreplaceWith 只不过是上传完成时应该粘贴的HTML字符串 . 因为使用配置选项覆盖所有这些方法的方法太多,最好的方法是替换该字符串以满足您的需求 .

    如果您想在上传过程中使用 Headers ,也可以覆盖 fileToElement 方法 .

相关问题