Проблемы с вставкой html на пользовательской панели инструментов в summernote

Question

Я пытаюсь добавить 2 пользовательских кнопки на панели инструментов summernote, 1, чтобы просто добавить разрыв строки, а другой - вставить текст с небольшим стилем. Когда я использую кнопки, он очищает html и не выполняет желаемый результат (разрыв строки или вставка небольшого текста). Как я могу вставить html из выбора панели инструментов и не изменить его?

Здесь кнопка рендеринга JQuery:

var BR_Button = function (context) { 
 
    var ui = $.summernote.ui; 
 

 
    // create button 
 
    var button = ui.button({ 
 
    contents: 'BR', 
 
    tooltip: 'Line Break', 
 
    click: function() { 
 
     // invoke insertText method with 'hello' on editor module. 
 
     context.invoke('editor.insertText', '<br/>'); 
 
    } 
 
    }); 
 

 
    return button.render(); // return button as jquery object 
 
} 
 

 
var Small_Button = function (context) { 
 
    var ui = $.summernote.ui; 
 

 
    // create button 
 
    var button = ui.button({ 
 
    contents: 'small', 
 
    tooltip: 'Small Style Emphasis', 
 
    click: function() { 
 
     // invoke insertText method with 'hello' on editor module. 
 
     context.invoke('editor.insertText', '<small>small text</small>'); 
 
    } 
 
    }); 
 

 
    return button.render(); // return button as jquery object 
 
}

И код панели инструментов настройки:

$('#id_text').summernote({ 
 
\t \t toolbar: [ 
 
\t \t ['paragraph', ['paragraph']], 
 
\t \t ['fontsize', ['style','fontname','fontsize','height']], 
 
\t \t ['style', ['bold', 'italic', 'underline', 'clear']], 
 
\t \t ['font', ['small','strikethrough', 'superscript', 'subscript']], 
 
\t \t ['color', ['color']], 
 
\t \t ['para', ['BR','ul', 'ol',]], 
 
\t \t ['insert', ['table','link','picture','video','hr']], 
 
\t \t ['codeview', ['codeview']], 
 
\t \t ], 
 
\t \t focus: true, 
 
\t \t buttons: { 
 
\t \t \t \t small: Small_Button, 
 
\t \t \t \t BR: BR_Button 
 
\t \t \t \t } 
 
\t \t });

Th Проблема заключается в том, что когда я нажимаю кнопку BR на панели инструментов, она вставляет < br/>, не давая мне фактического прерывания строки.

Answer 1

Вместо использования 'editor.insertText' используйте 'editor.pasteHTML' и это позволяет вставлять html, а не форсировать безопасные символы.

var BR_Button = функция (контекст) { var ui = $ .summernote.ui;

// кнопке создать кнопки уага = ui.button ({ содержания: 'BR', подсказки: 'Вставить разрыв строки', нажмите: функция() { // Вызывает метод InsertText с ' hello 'в редакторе. context.invoke (' editor.pasteHTML ','
'); } });