粘贴<p> </p>结束标记，而不会在contenteditable中生成开始的p标记

Question

我有一个满意的div：

<div id="result" class="content" contenteditable="true"><p><br/></p></div>

当我按下ENTER时，我想要新的段落形成，为此我拦截了ENTER keydown并通过插入html代码替换默认操作：

$(".content").on("keydown",function(e){if(e.which == 13) { e.preventDefault(); pasteHtmlAtCaret("</p><p><br/>");}});

我希望当我按下ENTER时，</p><p><br/>将关闭现有段落并打开一个新段落。所以，如果我键入：'hello world'+ ENTER，我应该：

<p>hello world</p><p><br/></p>

您可以识别</p><p><br/>件。 我观察到了不同的行为。我明白了：

<p>hello world<p></p><p><br></p></p>

因此，第一个</p>似乎产生了一个开始<p>标记，<p>标记之前的<br/>产生了匹配的结束标记。这是否意味着我的浏览器忽略了包装<p></p>的存在？ 当我插入一小段html代码时，如何避免生成新的p标签？

我正在使用Chromium和jQuery 1.7.2。

Answer 1

编辑发生在文档对象模型（DOM）中。 HTML标记实际上并不存在于编辑器中。 HTML被解析为DOM。在序列化DOM时，会再次生成HTML标记。因此，不能粘贴不正确的HTML片段而没有后果。