禁止在TinyMCE 4上拖动图像

Question

如何在TinyMCE 4上禁用拖拽图像？我使用jQuery

jQuery('#tinymce img').on('dragstart', function(event) {
    event.preventDefault();
});

但它不起作用。

Answer 1

粘贴插件

我找到了一些更好的解决方案。您可以只使用paste插件中的paste_block_drop选项，如

tinymce.init({
    plugins: 'paste image',
    paste_block_drop: true
)};

这个选项的作用很简单，就是让你在中阻止从编辑器到编辑器的拖放。

NB:在版本4.7.4上进行了测试，虽然我没有在他们当前的(当我回答时) paste插件documentation中找到它，而是在他们的documentation for version 4.3.12中找到的

PowerPaste插件

如果你使用的是Power Paste插件，你可以使用powerpaste_block_drop: true选项，该选项将禁用所有拖放到编辑器中的内容。你会找到关于这个here的文档(感谢评论中的@Kurt )

Answer 2

使用tinymce配置参数setup，并为此使用处理程序：

    setup: function(editor) {
        editor.on('init', function(event) {

        $(editor.getBody().parentNode).bind('dragover dragenter dragend drag drop', function(e) {
            e.stopPropagation();
            e.preventDefault();
        });

       $(editor.getDoc()).bind('draggesture', function(e) {
           e.stopPropagation();
           e.preventDefault();

       });
    });
  }