从contenteditable div中删除HTML格式,但在粘贴时保留换行符？

Question

我目前有一个内容可编辑的div我用作编辑器,但我想<br>在粘贴上删除html(不包括标签).

目前我有另一个div <div class="hiddendiv common editor"></div>这个收集所有添加到contenteditablediv的文本和数据,以确定contenteditable div的高度.

我变得困惑,不确定我将如何做到这一点.

我的问题是:如何<br>在使用jQuery粘贴时在光标插入处插入文本时删除html格式(不包括标签)？

HTML:

<div contenteditable='true' id="textarea" class="editor plain-box large-box textarea text common text-content-input quicksand color-dark-grey" data-text="Start typing..."></div>

<div class="hiddendiv common editor"></div> 

jQuery的

function pasteHtmlAtCaret(html) {
  var sel, range;
  if (window.getSelection) {
    sel = window.getSelection();
    if (sel.getRangeAt && sel.rangeCount) {
      range = sel.getRangeAt(0);
      range.deleteContents();
      var el = document.createElement("div");
      el.innerHTML = html;
      var frag = document.createDocumentFragment(), node, lastNode;
      while ((node = el.firstChild)) {
        lastNode = frag.appendChild(node);
      }
      range.insertNode(frag);

      if (lastNode) {
        range = range.cloneRange();
        range.setStartAfter(lastNode);
        range.collapse(true);
        sel.removeAllRanges();
        sel.addRange(range);
      }
    }
  } else if (document.selection && document.selection.type != "Control") {
    document.selection.createRange().pasteHTML(html);
  }
}

$('#textarea').on("paste", function() {
    var textarea = $('#textarea').html();
    var hidden_div = $('.hiddendiv').html(textarea);
    var plain_text = hidden_div.text();
    $('#textarea').pasteHtmlAtCaret(plain_text);
});

var txt = $('#textarea'),
    hiddenDiv = $(document.createElement('div')),
    content = null;

txt.addClass('txtstuff');
hiddenDiv.addClass('hiddendiv common editor');

$('body').append(hiddenDiv);

txt.on('keyup input propertychange', function () {

    content = $(this).html();

    content = content.replace(/\n/g, '<br>');
    hiddenDiv.html(content + '<br>');

    $(this).css('height', hiddenDiv.height());

});

Answer 1

这可能就是您\xe2\x80\x99正在寻找的：

\n\n

<div contenteditable="plaintext-only" id="textarea" data-text="Start typing..."></div>\n

\n