如何将HTML标记插入所选文本-Summernote

时间:2019-02-16 07:59:26

标签: jquery summernote

我正在使用summernote设置文本区域,并希望创建可以插入code html标签的自定义按钮

我尝试根据summernote文档创建简单的自定义按钮

这是我的代码

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

        // create button
        var button = ui.button({
            contents: '<i class="fa fa-code"/> Code',
            tooltip: 'Code',
            click: function (value) {
                var range = $('#textarea').summernote('createRange')
                // invoke insertText method with 'hello' on editor module.
                context.invoke('editor.insertHtml', '<code>'+range.toString()+'</code>');
            }
        });

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

让我说我想将<p>test</p>更改为<p><code>test</code></p>,但是上面的代码没有任何改变

1 个答案:

答案 0 :(得分:0)

click: function (value) {
var text = context.invoke('editor.getSelectedText');
// You can initialize node with class instead of calling addClass.
var $node = $('<p><code">'+text+'</code></p>');

// http://summernote.org/deep-dive/#insertnode
context.invoke('editor.insertNode', $node[0]);
}