当前位置：文江博客话题详情

ckeditor - onpaste 事件

发布于 2024-08-16 12:08:04 字数 173 浏览 4 评论 0原文

有谁知道如何在 CKEditor 3.x 中附加 onpaste 事件？

我基本上想获取 CTRL + V 数据并向其中添加一些文本，然后将其添加到编辑器中。

我环顾四周但没有找到明确的答案。 CKEditor 论坛没有太大帮助。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

请爱~陌生人 2024-08-23 12:08:04

这应该可以解决问题

var editor = CKEDITOR.instances.YourInputControlName;
editor.on('paste', function(evt) {
    // Update the text
    evt.editor.setData(evt.editor.getData() + ' your additional comments.');
}, editor.element.$);

This should do the trick

var editor = CKEDITOR.instances.YourInputControlName;
editor.on('paste', function(evt) {
    // Update the text
    evt.editor.setData(evt.editor.getData() + ' your additional comments.');
}, editor.element.$);

回复收藏 0 原文

天邊彩虹 2024-08-23 12:08:04

此示例通过删除所有 img 元素来编辑要粘贴的内容。

CKEDITOR.on('instanceReady', function (ev) {
    ev.editor.on('paste', function (ev) {
        ev.data.html = ev.data.html.replace(/<img( [^>]*)?>/gi, '');
    });
});

This example edits the content to be pasted by removing all img elements.

CKEDITOR.on('instanceReady', function (ev) {
    ev.editor.on('paste', function (ev) {
        ev.data.html = ev.data.html.replace(/<img( [^>]*)?>/gi, '');
    });
});

回复收藏 0 原文

梦屿孤独相伴 2024-08-23 12:08:04

你的两个例子都有点综合。

首先，editor.getData()获取编辑器的所有内容，因此如果您只想处理粘贴的数据，则需要获取ev.data.html并将其粘贴到正确的位置。

editor = CKEDITOR.instances.editor1;
editor.on('paste', function (evt) {
    var editor = evt.editor;
    evt.stop(); // we don't let editor to paste data, only for current event
    // show loader that blocks editor changes
    $.post('clean.php', {html: evt.data.html}, function (data) {
        editor.insertHtml( data.html ); // text will be inserted at correct place
        // hide loader
    }, 'json');
});

不要使用函数 editor.setReadonly(true/false)，您将无法将文本粘贴到正确的位置（在异步数据处理的情况下）。

Your both examples are a little bit synthetic.

At first, editor.getData() gets all the content of editor, so if you want to process only pasted data, you need to get ev.data.html and paste to correct place.

editor = CKEDITOR.instances.editor1;
editor.on('paste', function (evt) {
    var editor = evt.editor;
    evt.stop(); // we don't let editor to paste data, only for current event
    // show loader that blocks editor changes
    $.post('clean.php', {html: evt.data.html}, function (data) {
        editor.insertHtml( data.html ); // text will be inserted at correct place
        // hide loader
    }, 'json');
});

Don't use functions editor.setReadonly(true/false), you won't be able to paste text in correct place (in cases with async data processing).

回复收藏 0 原文

那片花海 2024-08-23 12:08:04

editor = CKEDITOR.instances[id];

editor.on('paste', function (evt) {
    evt.stop();
    var data = evt.data.dataValue;

    if (window.chrome || window.safari) {
        // removing span wrapper on webkit browsers.
        data = $(data).html();
    }
    evt.editor.insertHtml(data);
});

editor = CKEDITOR.instances[id];

editor.on('paste', function (evt) {
    evt.stop();
    var data = evt.data.dataValue;

    if (window.chrome || window.safari) {
        // removing span wrapper on webkit browsers.
        data = $(data).html();
    }
    evt.editor.insertHtml(data);
});

回复收藏 0 原文

软糯酥胸 2024-08-23 12:08:04

我知道这是一个老问题，但我想我应该添加我的 Aliaksej 答案版本，因为它允许使用自定义“清洁器” - 它对我来说不太有效，直到我将其修改如下。

editor = CKEDITOR.instances[id];
editor.on('paste', function (evt) { 
   evt.stop();
   $.post('/actions/clean.php', {html: evt.data.dataValue}).done(function (data) {
      evt.editor.insertHtml(data);
   }, 'json');
});

I know it's an old question, but thought I'd add my version of aliaksej's answer as it allows the use of a custom 'cleaner' - it didn't quite work for me until I modded it as below.

editor = CKEDITOR.instances[id];
editor.on('paste', function (evt) { 
   evt.stop();
   $.post('/actions/clean.php', {html: evt.data.dataValue}).done(function (data) {
      evt.editor.insertHtml(data);
   }, 'json');
});

回复收藏 0 原文

~没有更多了~