CLEditor, вставка содержимого в виде текста в главном окне

Question

Я использую CLEditor, http://premiumsoftware.net/cleditor/, для моего текстового редактора. Существует функция "вставить как текст", которая при нажатии на кнопку появляется всплывающее окно с текстовой областью для вставки содержимого и удаления стилей.

То, что я хотел бы сделать, это взять ту же самую функциональность, но каждый раз, когда кто-то вставляет в основную текстовую область, это действие выполняется автоматически. Как бы это вызвать?

Я создал JS Fiddle, http://jsfiddle.net/helpinspireme/naubS/, но не смог вставить туда все JS, поэтому для ссылки на основной файл JS для CLEditor посетите их сайт: http://premiumsoftware.net/cleditor/

Спасибо за помощь.

Answer 1

Мне известно, что я не отвечаю на ваш реальный вопрос, но в случае, если ваша настоящая проблема - это мусор, создаваемый пользователем, который пытается вставить текст из Microsoft Office (например, Word), я бы порекомендовал рассмотреть альтернативное решение.

Сам CLEditor может переключаться между iFrame (режим расширенного текста) и текстовой областью (режим источника). Функциональность "Вставить как текст" использует текстовую область, которая сама по себе не поддерживает форматированный текст, так что в первую очередь она не допускает мусорный HTML.

Однако, если редактор находится в режиме расширенного текста, очень трудно предотвратить вставку пользователем текста из Word (он может использовать обычную кнопку вставки, нажать CTRL-V или даже использовать контекстное меню правой кнопки мыши, которые представляют собой разные события. и трудно перехватить с помощью JavaScript). Так что теперь ущерб уже нанесен; у вас есть грязный HTML внутри вашего редактора. Поэтому вместо того, чтобы пытаться очистить мусор, производимый Word, я реализовал следующую проверку (javascript) после сохранения захваченного ввода:

if(clEditorValue && (clEditorValue.indexOf('<!--') !== -1 || clEditorValue.indexOf('mso-ansi-language') !== -1 ) ) {
  alert('Unable to process text pasted from Word, please use "Paste as text" or modify your input');
  return;
}

Я надеюсь, что этот ответ будет полезен для других людей, пытающихся достичь того же.

Answer 2

При вставке в cleditor редактор выбирает все html из источника. В итоге я отредактировал jquery.cleditor.js и добавил функцию привязки к функции $doc.click(hidePopups). Я использовал setTimeouts, чтобы позволить тексту заполнить ввод и функцию updateTextArea для завершения.

    .bind("paste", function() {
            setTimeout(function() {
                refreshButtons(editor);
                updateTextArea(editor, true);
                //remove any and all html from the paste action
                setTimeout(function() {
                    //clean up the html with removeHtml function
                    $(editor.doc.body).html(removeHtml($(editor.doc.body).html()));

                    //change the input value with new clean string
                    $("#" + editor.$area[0].id).val($(editor.doc.body).html());
                }, 100);
            }, 100);
        })

Я использую функцию removeHtml ниже, чтобы удалить весь HTML из вставленного содержимого.

//remove html altogether
function removeHtml(str) {
    var regex = /(<([^>]+)>)/ig;
    var result = str.replace(regex, "");
    return result;
}

Это решение сейчас в производстве.