Javascript contentEditable-Firefox<；br/>；标签

Firefox在按enter键时插入一个

标记，而其他浏览器则添加一个

或

。我知道chrome和safari正在插入contentEditable div的第一个子项的相同标记。但是，如果第一个标记的innerHTML为空，Firefox也会这样做。Firefox只是忽略该标记，并通过在第二行中推送默认节点创建新行，并直接在编辑器中写入，而不是在子节点中写入。所以基本上，我希望Firefox在给定的标记中写入，并在每次按enter键时继续插入这种节点。怎样才能做到呢？有什么建议吗

尝试在元素中插入

。那么几乎可以肯定的是，每一个换行符都将是一个新的段落。

我找到了解决方案：）为了实现这一点，您必须为插入符号的父元素提供一个id。然后可以使用以下代码。请注意，我从c#获取browsernName并将其放入一个隐藏字段中。这就是为什么我把它比作“firefox”。下面的代码是用FF3.6测试的，它工作得非常好。唯一的问题是，您必须检查插入符号的父元素，如果它不等于当前行的id，则必须使用选择函数将插入符号放置在当前行中。此外，在keyup事件上执行此代码，并确保如果在keyup事件上执行其他代码，请将此代码放在其末尾！安威，享受：）

//该代码在以下情况下运行良好：
//1）如果编辑器中有文本，并且用户选择整个文本
//并将其替换为单个字符，将放置标记，然后
//文本将放置在p标记内
//2）如果用户选择整个代码并将其删除，然后再次开始键入
//3）如果用户正常键入并按enter键
//注意：如果你发现任何错误，请注意我
如果（浏览器名==“firefox”）{
//删除所有br标签
var brs=txteditor.getElementsByTagName（“br”）；
对于（var i=0；i“+str+”
”；
//为了防止在文本编辑器中清除重复的行
txteditor.innerHTML=“”；
document.execCommand（'insertHTML'，false，nText）；
}否则{
//始终确保当前行的innerHTML从不为空
if（document.getElementById（cRow.innerHTML==“”）
document.getElementById（cRow.innerHTML=“​；”；
}
}

如果将contenteditable元素更改为

而不是

，则新行将使用

创建。我没有用其他元素对此进行测试，但看看不同元素的行为会是怎样的会很有趣

---

元素可以使用

显示：block

设置样式，使其看起来像

元素。

我实际上是这么说的，但是当

内部为空或者当用户点击第一个键时，Firefox会忽略它。我找到了解决方案。首先，当页面加载时，请遵循以下步骤：1）如果有对contenteditable div的关注，请关注它。2） 如果您的texteditor没有初始标记，请插入您想要的任何内容，可以是

或

标记或任何内容。现在，每当用户删除所有内容时，文本编辑器将自动创建一个

标记。所以基本上，当你在firefox中关注页面加载时，错误就会出现，如果你不关注，它就不会出现：）希望那些遭受同样错误的人会注意到enjoy@Shaokan有趣。秘密可能是carret（光标的编辑点）默认在第一个标记之前启动。当你对焦时（或者如果需要，取消对焦并对焦），卡雷特被放置在第一个元素内（如果可能的话）有趣的问题：当可编辑元素中有

时会发生什么。光标是放在

p

标记的前面还是里面？：）如果在加载页面时将焦点放在编辑器上，则插入符号将放在div前面。否则，如果让用户聚焦，则它将聚焦在标记内。但是，每当按enter键时，标记将放置在标记内。因此，我猜Firefox正在插入同一类型的节点，无论最深的节点是什么，并且对树的其余部分不感兴趣。请添加您的解决方案作为答案。我会的，但我必须等待24小时：）我只是想建议一个讨厌的小IF浏览器解决方案。谢谢@孩子们很高兴这有帮助：）

// The code works good in the following cases:
// 1) If there is text inside the editor and the user selects the whole text
//    and replace it with a single character, the <p> tag will be placed and the
//    text will place inside the p tag
// 2) If the user selects the whole code and deletes it and begins to type again
// 3) If the user types normally and press enter 
// NB: Please note me if you find any bug

if (browserName == "firefox") {
    //remove all br tags
    var brs = txteditor.getElementsByTagName("br");
    for (var i = 0; i < brs.length; i++) { brs[i].parentNode.removeChild(brs[i]); }
    //check whether there is a p tag inside
    var para = txteditor.getElementsByTagName("p");
    if (para.length == 0) {
        var inner = txteditor.innerHTML.replace(/^\s+|\s+$/g, '');
        var str = (inner == "") ? "&#8203;" : txteditor.innerHTML;
        var nText = "<p id=\"" + cRow + "\">" + str + "</p>";
        // in order to prevent a dublicate row clear inside the text editor
        txteditor.innerHTML = "";
        document.execCommand('insertHTML', false, nText);
    } else {
        // always make sure that the current row's innerHTML is never empty
        if (document.getElementById(cRow).innerHTML == "")
            document.getElementById(cRow).innerHTML = "&#8203;";
    }
}