bootstrap 夏令营 reset/clear

Question

我想知道如何使用 jQuery 或 JavaScript.

重置或清除 bootstrap Summernote 所见即所得编辑器

我尝试了以下代码

$('#MyForm').delay(1000).resetForm(1000);

除了带有 Summernote 的文本区域外，此剂量重置了整个表单

$('#SummernoteText').reset();

SummernoteText 是 html 文本区域，但代码根本不执行任何操作。

$('#SummernoteText').destroy();

以上似乎是销毁编辑器而不是清除编辑器。

谁能告诉我如何做到这一点。

Link 到 Summernote http://summernote.org/#/

Answer 1

$('#SummernoteText').code('');

Answer 2

您可以像这样在编辑器本身的工具栏中构建自定义按钮：

//first create the button
var clearAllButton = function (context)
{
    var ui = $.summernote.ui;

    // create button
    var button = ui.button({
        contents: '<b>x</b>',
        tooltip: 'Clear All',
        click: function()
        {
            $("#summernote_field").summernote('code', '');
            $("#summernote_field").summernote({focus: true});
        }
    });

    return button.render();
};

//now set the options to include it
$('#summernote_field').summernote({
    toolbar: [
    .
    .
    .
    .
    ['misc', ['clearAll']]
    ],

    buttons: {
        clearAll: clearAllButton
    },

});

Answer 3

对于 Summernote 0.8.1 版本，使用这个简单的代码：

$("#SummernoteText").summernote("reset");

Answer 4

有点晚了，但补充一下：

选项 1：

$('#SummernoteText').summernote('reset');

此解决方案仅在您的编辑器最初为空时才有效

这会将您的编辑器重置为原始状态。意思是，如果你用任何数据初始化它，相同的数据将在重置时重新出现。

选项 2：

$('#SummernoteText').summernote('code', '<p><br></p>');

之所以添加 <p><br></p> 标签而不是简单的 '' 是因为 summernote 编辑区需要它作为焦点。 (Reference)

Answer 5

这是用 summernote 0.8.2 测试的。

如果您将 summernote 元素定义为

<textarea id="your-text-area-id" name="your-text-area-name" ></textarea>
<div class="summernote" id="summer-note-text-id"></div>

然后您可以使用

空白文本

$("#summer-note-text-id").summernote("code", "");

@naribo 的回答更详细地说明了要设置的值，而不仅仅是“”。

bootstrap 夏令营 reset/clear

bootstrap Summernote reset/clear

javascript

jquery

wysiwyg

twitter-bootstrap-3

summernote