redactor.js pastePlainText - but need button to paste html instead

前端 未结 3 2004
误落风尘
误落风尘 2021-01-15 11:53

Most of our customers complain about formatting carried across from Word to our redactor.js rich text editor fields. We upgraded to use the pastePlainText setting, which see

3条回答
  •  萌比男神i
    2021-01-15 12:53

    If you've just recently upgraded from Redactor v9 to v10, you will find that the above code does not work since Redactor has now updated most of its existing APIs and added new modules. For example, .modalInit(), .selectionRestore(), .selectionSave(), .insertHtml() from v9 is now .modal.load(), selection.restore(), .selection.save(), etc in v10.

    I've modified the above code slightly and am adding it here if anybody's interested. Feel free to edit/ optimize it if needed.

    Reference - http://imperavi.com/redactor/docs/how-to-create-modal/

    if (!RedactorPlugins) var RedactorPlugins = {};
    
    RedactorPlugins.pasteasplaintext = function()
    {
        return {
            init: function()
            {
                // add a button to the toolbar that calls the showMyModal method when clicked
                var button = this.button.add('pasteasplaintext', 'Paste As Plain Text');
                this.button.setAwesome('pasteasplaintext', 'fa-paste');
                this.button.addCallback(button, this.pasteasplaintext.showMyModal);
            },
            getTemplate: function()
            {
                // this function creates template for modal that is to be added
                return String()
                + '
    ' + '
    ' + ' ' + ' ' + '
    ' + '
    '; }, showMyModal: function () { // fetch and load template this.modal.addTemplate('pasteasplaintext', this.pasteasplaintext.getTemplate()); this.modal.load('pasteasplaintext', 'Paste As Plain Text', 500); // create cancel and insert buttons this.modal.createCancelButton(); var buttonPaste = this.modal.createActionButton('Paste'); buttonPaste.on('click',this.pasteasplaintext.insertFromMyModal); // save current content, show modal and add focus to textarea this.selection.save(); this.modal.show(); $("#mymodal-textarea").focus(); }, insertFromMyModal: function (html) { // remove formatting from the text pasted into the textarea html = $('#mymodal-textarea').val(); var tmp = document.createElement('div'); html = html.replace(/
    |<\/H[1-6]>|<\/p>|<\/div>/gi, '\n'); tmp.innerHTML = html; html = tmp.textContent || tmp.innerText; html = $.trim(html); html = html.replace('\n', '
    '); // close modal, restore content and insert 'plain' text this.modal.close(); this.selection.restore(); this.insert.html(html); $("#mymodal").remove(); } }; };

提交回复
热议问题