在 Summernote 中使用 而不是 ？答案

【问题标题】：Using instead of in Summernote?在 Summernote 中使用 而不是 ？
【发布时间】：2016-09-08 04:59:03
【问题描述】：

当用户单击 Enter 按钮时，需要在 Summernote 编辑器中使用   标签而不是 ，所以这是我的代码：

var $this = $(this),
    box = $('textarea.CommentsFields');
box.summernote({
    height: 100,
    focus: true,
    toolbar: [
        [ 'all', [ 'bold', 'strikethrough', 'ul', 'ol', 'link' ] ],
        [ 'sided', [ 'fullscreen' ] ]
    ],
    callbacks: {
        onEnter: function(){
            box.summernote('insertNode', document.createTextNode("<br>")); 
            console.log('uiwdbvuwecbweuiuinsjk');
        }
    }
});

我编写了 onEnter 事件的自定义回调，当用户点击返回按钮时，它会引发回调，并编写   标签，这不是我想要的。

我阅读了他们的文档，但不明白如何停止输入按钮的默认操作并编写   标签而不是将元素包装在  标签中。

有什么想法吗？谢谢

【问题讨论】：

试试这个：github.com/summernote/summernote/issues/546
我认为他们在最新版本中更改了模块/插件架构，但没有奏效
你有一个解决方法at this reply。
Summernote 现在吹了，升级到 8+ 版后成为我工作中存在的祸根

标签： javascript jquery html wysiwyg summernote

【解决方案1】：

这段代码对我有用：

$("#summernote").on("summernote.enter", function(we, e) {
     $(this).summernote("pasteHTML", "<br><br>");
     e.preventDefault();
});

这会拦截 Enter 按下事件并更改其默认行为，插入   而不是新段落。

【讨论】：

很好的解决方案！谢谢！

【解决方案2】：

如果您不想更改或修复summernote 库本身，可以使用shortcut keys 添加换行符。

使用Shift + Enter 换行。
使用Enter 更改段落，如summernote 添加div/p 以在按Enter 时开始新行。

希望这行得通。

【讨论】：

【解决方案3】：

保证 2 班轮 & 无插件：

$.summernote.dom.emptyPara = "<div><br></div>"; // js

.note-editor .note-status-output{display:none;} /*css*/

【讨论】：

既然div已经是块元素了，为什么还要加上br元素呢？它不会只是打破 2 行而不是 1 行吗？

【解决方案4】：

今天summernote没有办法做你想做的事。您可以查看https://github.com/summernote/summernote/issues/702，因此，唯一的方法是为不同的段落样式创建具有固定逻辑的自己的拉取请求。

【讨论】：

是的，这就是我不尝试删除父
标签的原因。所以这个想法应该只有一个 p 标签。
嘿，你找到解决这个问题的方法了吗？我有同样的问题

【解决方案5】：

这对我有用

替换（在 Summernote.js 第 3786 行）

    if (event.keyCode === key.code.ENTER) {
        context.triggerEvent('enter', event);
    }

在

    if (event.keyCode === key.code.ENTER) {
        return;
    }

【讨论】：

【解决方案6】：

SummerNote 上似乎有 at least 10 or so bugs filed 关于这个问题，遗憾的是没有修复或计划修复它。

幸运的是，您可以偷偷摸摸地修复它，这对于未来的版本来说会很脆弱 - 所以请谨慎升级。你猴子补丁它：

$.summernote.dom.emptyPara = "<div><br/></div>";
box.summernote(options);

第一行是修复 - Monkey Patch。我在第二行中加入了 SummerNote 初始化的地方，只是为了证明您必须在启动 SummerNote 之前执行 Monkey Patch - 否则 Monkey Patch 将无法进入，您仍然会在输入时获得 p 标签。

【讨论】：

【解决方案7】：

我遇到了这个问题，解决方法如下。

回调中的 onKeydown 函数可以解决您的问题。

示例：

$('.textarea-editor').summernote({
  height: 250, // set editor height  
  minHeight: null, // set minimum height of editor  
  maxHeight: null, // set maximum height of editor  
  focus: true, // set focus to editable area after initializing summernote  
  htmlMode: true,
  lineNumbers: true,
  codemirror: { // codemirror options
    theme: 'monokai'
  },
  mode: 'text/html',
  callbacks: {
    onKeydown: function(e) {
      e.stopPropagation();
    }
  }
});

【讨论】：