如何禁用 CKEditor 5 中的放置事件
How can I disable drop events in CKEditor 5
我们正在尝试将 CKEditor 5 实施到我们的应用程序中,但我们在文档方面遇到了一些困难。
我们想禁用拖放到编辑区域的事件或以某种方式控制它。有这样的活动吗?
我们尝试了 editor.model.document.on('clipboardInput')
或 editor.model.document.on('dragover')
,但没有成功。这些事件不会被触发。
您需要收听dragover
and drop
events on the view layer instead of on the model。
我准备了一个简单的函数,可以作为插件加载到 CKEditor 5 中以取消这些事件:
/**
* Cancel the `drop` and `dragover` events.
*
* @param {module:core/editor/editor~Editor} editor
*/
function cancelDropEvents( editor ) {
// High priority means that the callbacks below will be called before other CKEditor's plugins.
editor.editing.view.document.on( 'drop', ( evt, data ) => {
// Stop executing next callbacks.
evt.stop();
// Prevent the default event action.
data.preventDefault();
}, { priority: 'high' } );
editor.editing.view.document.on( 'dragover', ( evt, data ) => {
evt.stop();
data.preventDefault();
}, { priority: 'high' } );
}
您可以在线查看它的工作原理 – https://jsfiddle.net/pomek/qz0o9ku0/。
我们正在尝试将 CKEditor 5 实施到我们的应用程序中,但我们在文档方面遇到了一些困难。
我们想禁用拖放到编辑区域的事件或以某种方式控制它。有这样的活动吗?
我们尝试了 editor.model.document.on('clipboardInput')
或 editor.model.document.on('dragover')
,但没有成功。这些事件不会被触发。
您需要收听dragover
and drop
events on the view layer instead of on the model。
我准备了一个简单的函数,可以作为插件加载到 CKEditor 5 中以取消这些事件:
/**
* Cancel the `drop` and `dragover` events.
*
* @param {module:core/editor/editor~Editor} editor
*/
function cancelDropEvents( editor ) {
// High priority means that the callbacks below will be called before other CKEditor's plugins.
editor.editing.view.document.on( 'drop', ( evt, data ) => {
// Stop executing next callbacks.
evt.stop();
// Prevent the default event action.
data.preventDefault();
}, { priority: 'high' } );
editor.editing.view.document.on( 'dragover', ( evt, data ) => {
evt.stop();
data.preventDefault();
}, { priority: 'high' } );
}
您可以在线查看它的工作原理 – https://jsfiddle.net/pomek/qz0o9ku0/。