javascript - 将 contenteditable 和覆盖换行符设置为而不是在元素末尾不起作用

Question

我在jsFiddle.net中做了一个简单的脚本来显示我的问题。

我尝试使用以下脚本将contenteditable=true元素中的换行符从默认值覆盖<div>为 a ：<br />

$(".editContents").on("keydown","[contenteditable=true]",function(e) {
    if(e.which===13) {
        lineBreak = "<br />";
        document.execCommand("insertHTML",false,lineBreak);
        return false;
    }
});

如果您enter在文本内按，它的工作原理就像它应该的那样 -但是一旦您尝试在段落末尾换行，什么都不会发生。

不幸的是，我不知道它有什么问题。热烈欢迎任何帮助:-)

Answer 1

它实际上正在工作并<br />在 的末尾插入 a ，但元素<p>末尾的空格被截断。<p>您可以通过在段落末尾按 enter 后检查元素来看到这一点。问题是，在 , 的末尾<p>只execCommand()允许插入一个。它似乎不是插入，而是替换。

如果您添加另一个字符'<br />'并插入它'<br /> '（>在<p>.

您可能必须检查它是否是最后一个字符并使用insertAdjacentHTML()withbeforeEnd代替。