Summernote 所见即所得：将代码视图设置为默认视图答案

【问题标题】：Summernote WYSIWYG : set code view as default viewSummernote 所见即所得：将代码视图设置为默认视图
【发布时间】：2015-01-14 13:33:51
【问题描述】：

我在网上找不到任何关于此的信息。有没有办法将 Summernote（所见即所得的 jQuery 文本编辑器）的默认视图设置为代码/html 视图。我想在登陆表单页面时直接看到 HTML 代码。

谢谢

【问题讨论】：

标签： wysiwyg summernote

【解决方案1】：

你可以模拟点击codeview按钮（在summernote初始化之后），它对我有用：

$('.summernote').summernote({
     oninit: function() {
         $("div.note-editor button[data-event='codeview']").click();
     }
});

【讨论】：

谢谢。这就是我最终所做的。

【解决方案2】：

来自Summernote documentation：

v0.7.0 之后，每个回调都应该被回调对象包裹。

所以，为了工作，js应该是这样的：

$('.summernote_editor').summernote({
    callbacks: {
        onInit: function() {
            $("div.note-editor button.btn-codeview").click();
        }
    }
});

【讨论】：

【解决方案3】：

不是很优雅，我不知道是否有合适的方法，但如果你愿意，可以试试：

据我所知，我没有看得很仔细，codeview 按钮是这样的：

将“codeview”类添加到 div.note-editor
禁用所有按钮
将“活动”类添加到代码视图按钮元素。

您可能会发现它还可以做其他事情，但这应该会让您走上一条可行的道路。

                $('div.note-editor').addClass('codeview');
                $('div.note-editor.codeview button').addClass('disabled');
                $("div.note-editor.codeview button[data-event='codeview']").removeClass('disabled').addClass('active');

【讨论】：

【解决方案4】：

嗯，你可以使用初始化回调。

$('.summernote').on('summernote.init', function () {
      $('.summernote').summernote('codeview.activate');
    }).summernote({
      height: 300,
      placeholder: 'Paste content here...',
      codemirror: { 
        theme: 'monokai'
      }
    });

【讨论】：