javascript 使用< br>而不是< p>在Summernote

56lgkhnf  于 2023-10-14  发布在  Java
关注(0)|答案(8)|浏览(156)

需要在summernote编辑器中使用<br>标记,而不是在用户单击Enter按钮时使用<p>,所以这里是我的代码:

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事件的自定义回调,当用户点击返回按钮时,它会引发一个回调,并写入<br>标记,这不是我要找的。

我读了他们的文档,但不明白如何停止enter按钮的默认操作,并写入<br>标记,而不是将元素 Package 在<p>标记中。
知道吗?谢谢

fzwojiic

fzwojiic1#

这段代码为我工作:

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

这将拦截Enter press事件并更改其默认行为,插入<br>而不是新段落。

3pmvbmvn

3pmvbmvn2#

如果你不想改变或修复summernote库本身,你可以使用shortcut keys来添加换行符。

  • 使用Shift + Enter来提供换行符。
  • 使用Enter更改段落,如summernote添加div/p以在按Enter时开始新行。

希望这有用。

qni6mghb

qni6mghb3#

在SummerNote上似乎有atleast10orsobugsfiled关于这个问题,不幸的是没有修复或计划修复它。
幸运的是,你可以用一种偷偷摸摸的方式修复它,这对未来的版本来说将是非常脆弱的-所以要小心升级。你猴子修补它:

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

第一行是修复-猴子补丁。我包括了第二行,在那里SummerNote被初始化,只是为了证明你必须在启动SummerNote之前做你的Monkey Patch-否则Monkey Patch不会成功,你仍然会在进入时得到p标记。

wooyq4lh

wooyq4lh4#

保证2班轮和没有插件

$.summernote.dom.emptyPara = "<div><br></div>"; // js
.note-editor .note-status-output{display:none;} /*css*/
jtoj6r0c

jtoj6r0c5#

今天summernote没有办法做你想做的。你可以检查https://github.com/summernote/summernote/issues/702,所以,唯一的方法是为不同的段落风格创建自己的pull-request。

dnph8jn4

dnph8jn46#

这对我很有效
替换(在Summernote.js第3786行)

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

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

azpvetkf7#

我遇到了这个问题,解决方案在下面。

回调函数中的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();
    }
  }
});
mwyxok5s

mwyxok5s8#

添加此JavaScript解决输入问题

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

使用空的x标签...这是一个虚拟的目的标签…
100%为我工作任何疑问..联系人:email protected(https://stackoverflow.com/cdn-cgi/l/email-protection)

相关问题