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

时间:2015-07-10 15:39:59

标签: javascript jquery html

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

HTML:之前

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

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

HTML:之后

Some text

而不是

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

2 个答案:

答案 0 :(得分:0)

使用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;

答案 1 :(得分:0)

如果要按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;