SummerNote insertHtml

时间:2015-12-09 04:48:49

标签: javascript jquery html summernote

我有一个'模板'选择器,使人们可以更改&text; / html'目前的textarea。

因此,当他们更改模板时,我需要更新Summernote HTML。我看到了(insertText)的方法,但它不适用于HTML。

是否有HTML版本的解决方案?

我认为有一个.code()解决方案,但似乎无法正常工作? 我收到错误,"不是函数"

非常感谢任何帮助!

$('.dialogMessageArea').summernote({
            height:'230px',
            focus:true,
            toolbar: [
                ['style', ['bold', 'italic', 'underline', 'clear']],
                ['fontsize', ['fontsize']],
                ['para', ['ul', 'ol', 'paragraph']],
                ['table', ['table']],
                ['misc', ['fullscreen','undo','redo']]
            ]
        });

        $(document).on('change', '.messageTemplate', function() {
            var templateId = $(this).selected().attr('value');
            if(templateId) {
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: '/cont/templates/GetTemplate',
                    data: {'templateId': templateId},
                    success: function (data) {
                        $('.subjectMessage').val(data.results[0].subject);
                        if(data.results[0].template) {
                            $('.dialogMessageArea').code(data.results[0].template);
                        }
                    },
                    error: function () {
                        alert('We were not able to get your template');
                    }
                });
            }
        });
console.log($('.dialogMessageArea'));
console.log("<b>Welcome</b><h3>hello world</h3>");

enter image description here

5 个答案:

答案 0 :(得分:33)

根据api(http://summernote.org/getting-started/#basic-api),

要改变所见即所得的价值,你应该使用夏令营功能和#39;代码&#39; string作为第一个参数,你的内容作为第二个参数

像这样:

$('.dialogMessageArea').summernote('code', data.results[0].template);

答案 1 :(得分:17)

.summernote('pasteHTML', '<b>inserted html</b> ');

答案 2 :(得分:1)

这实际上应该有效

$('.dialogMessageArea').code('some value you want'); 

注意:

code()函数中的HTML必须是一个字符串。如果您尝试插入invalid HTML内容,我认为它不会起作用。

尝试这样做

创建一个隐藏的div,然后在AJAX success方法中尝试从AJAX插入数据,然后使用jquery的text()函数检索它。

<div style="display:none;" id="hidden_div">


            success: function (data) {
                $('.subjectMessage').val(data.results[0].subject);
                if(data.results[0].template) {
                    $('#hidden_div').html(data.results[0].template);
                    $('.dialogMessageArea').code($('#hidden_div').text());
                }
            },

答案 3 :(得分:1)

如果您不想替换注释中的所有内容,可以使用execCommand WebAPI中的insertHTML命令。

由于summernote基于execCommand WebAPI,我们可以直接使用其资源。 因此,向summernote添加HTML内容的最简单方法是使用insertHtml参数,如下所示:

document.execCommand('insertHtml', null, '<p>My text <span style="color:red;">here</span></p>');

答案 4 :(得分:0)

这最适合我

var html = '<h2>Hello World!!</h2>'; $('#divID').summernote('code', html);