Вставить содержимое в виде обычного текста в редакторе summernote

Мне нужно скопировать какой-нибудь контент в мой редактор summernote. Но когда я вставляю, он берет стиль страницы, откуда я ее скопировал. Мне нужно вставить его в виде обычного текста. Есть ли какое-либо решение?

Ответы

Ответ 1

Используйте onPaste Обратный вызов

Используйте параметр onPaste, чтобы определить обратный вызов, который будет разделять теги и вручную вставлять текст.

$editor.summernote({
    onPaste: function (e) {
        var bufferText = ((e.originalEvent || e).clipboardData || window.clipboardData).getData('Text');
        e.preventDefault();
        document.execCommand('insertText', false, bufferText);
    }
});

Кредит: https://github.com/summernote/summernote/issues/303

Решить проблемы с Firefox:

У вас могут быть проблемы с Firefox. Если это так, оберните document.execCommand в функцию таймера, чтобы задержать его выполнение крошечным битом:

setTimeout(function(){
    document.execCommand( 'insertText', false, bufferText );
}, 10);

Обновление для v0.7.0 +

Позиция обратных вызовов в параметрах изменяется после v0.7.0
После v0.7.0 каждый обратный вызов должен быть обернут объектом обратных вызовов. (источник)

Это означает, что исходный код должен быть записан как

$editor.summernote({
    callbacks: {
        onPaste: function (e) {
            var bufferText = ((e.originalEvent || e).clipboardData || window.clipboardData).getData('Text');
            e.preventDefault();
            document.execCommand('insertText', false, bufferText);
        }
    }
});

Благодарим Матье Кастеста за то, что вы указали это (так что если этот бит помог, поддержите его ответ!)

TL; DR: Здесь представлена ​​функциональная демонстрация

Ответ 2

После v0.7.0 каждый обратный вызов должен быть обернут объектом обратных вызовов. http://summernote.org/deep-dive/#callbacks

Итак, если вы используете summernote от v0.7.0 или выше, ответ jcuenod теперь можно переписать как:

$('.summernote').summernote({
    callbacks: {
        onPaste: function (e) {
            var bufferText = ((e.originalEvent || e).clipboardData || window.clipboardData).getData('Text');

            e.preventDefault();

            // Firefox fix
            setTimeout(function () {
                document.execCommand('insertText', false, bufferText);
            }, 10);
        }
    }
});

Ответ 3

Обратный вызов onPaste прекрасно работает, но у меня были проблемы с разной обработкой переносов строк в разных браузерах. Поэтому я пришел к следующему решению, в котором используются html-строки:



    $(".htmleditor").summernote({
      callbacks: {
        // callback for pasting text only (no formatting)
        onPaste: function (e) {
          var bufferText = ((e.originalEvent || e).clipboardData || window.clipboardData).getData('Text');
          e.preventDefault();
          bufferText = bufferText.replace(/\r?\n/g, '<br>');
          document.execCommand('insertHtml', false, bufferText);
        }
      }
    });

Ответ 4

Удалось сделать ужасную работу для IE11. Это, к сожалению, также попросит разрешение на вставку от пользователя. Если кто-то выяснит лучшее предложение, я все уши.

var trap = false;
$(document).ready(function () {
    $('#summernote').summernote({
        callbacks: {
            onPaste: function (e) {
                if (document.queryCommandSupported("insertText")) {
                    var text = $(e.currentTarget).html();
                    var bufferText = ((e.originalEvent || e).clipboardData || window.clipboardData).getData('Text');

                    setTimeout(function () {
                        document.execCommand('insertText', false, bufferText);
                    }, 10);
                    e.preventDefault();
                } else { //IE
                    var text = window.clipboardData.getData("text")
                    if (trap) {
                        trap = false;
                    } else {
                        trap = true;
                        setTimeout(function () {
                            document.execCommand('paste', false, text);
                        }, 10);
                        e.preventDefault();
                    }
                }

            }
        }
    })
})

JSFiddle

Ответ 5

Ctrl + Shift + V является самым простым решением: D