当contenteditable div包含文本时如何删除标记？

Question

当用户在满意的<p>中输入内容时，您如何完全删除代码？

HTML：之前

<p contenteditable="true"></p>

现在，如果用户在可疑*Some text*中输入<p>，则现在会显示该页面：

HTML：之后

Some text

而不是

<p contenteditable="true">Some text</p>

Answer 1

使用replaceWith()

＆＃13;

＆＃13;

var text = $('[contenteditable="true"]').text();
$('[contenteditable="true"]').replaceWith(text);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p contenteditable="true">Some text</p>

＆＃13;

＆＃13;

＆＃13;

Answer 2

如果要按p键删除Enter标记，可以使用以下内容：

＆＃13;

＆＃13;

$('p').keyup(function(e) {
  if ($(this).attr('contentEditable') == "true") {
    if (e.which == '13') {
      $(this).contents().unwrap('p');
    }
  }
});

＆＃13;

p {
  border: 2px solid gray;
  padding: 10px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p contenteditable="true">Edit me and press Enter</p>

＆＃13;

＆＃13;

＆＃13;