虽然我在网页编辑器方面做得很满意,但我遇到了一些奇怪的行为。
如果我在contenteditable元素中按Enter键,则当前行的DOM将被复制到下一行。然后再次按回车键,再次复制DOM。 但这种情况只发生在插入符号内容结束时。顺便说一句,只有文本内容不会发生。 我在最新的Chrome浏览器上制作了这种情况。
<div id="editor" contenteditable="true" style="border:1px solid #000; width:500px; height:200px;">
<p><span class="name">content</span></p>
</div>
<div id="before" style="border:1px solid blue; width:500px; height:100px;"></div>
<div id="afterEnterKeyPressed" style="border:1px solid red; width:500px; height:100px;"></div>
$('#editor').on('keyup', function(e) {
var keyCode = e.keyCode;
if (keyCode === 13) {
$('#afterEnterKeyPressed').text($('#editor').html());
}
});
$('#before').text($('#editor').html());