使用 innerHTML 的 Firefox contentEditable 问题

Question

我的标签 "contenteditable" 有问题，仅在 firefox 中。我希望用户能够修改他正在创建的调查的标题，以及动态创建的问题的标题。它在 IE 和 Chrome 上运行良好，但在 Firefox 上我无法修改问题标题。

这是它的样子在 chrome 上：https://gyazo.com/f142c432fcd2994a5f254106d912ff11

在 Firefox 上：https://gyazo.com/5e454710231dc5c957dc46358cf92cf0

标题的代码（完全可以正常工作）是

<h3 id="surveyTitle" class="text_justify fi-page-edit" contenteditable="true">Survey title</h3>

对于生成的问题

    var questionDiv = document.createElement("div");
    questionDiv.innerHTML = "<div class='large-12 columns mybold fi-page-edit' style='resize: none;' contenteditable='true' id='title"+questionNumber+"'>Question "+questionNumber+"</div>  </br>";
    var container = document.getElementById("viewForm");
    container.appendChild(questionDiv);
    container.appendChild(document.createElement("br"));

可能是因为 "viewForm" 是一个禁用的字段集 :

<form>
  <fieldset disabled="disabled" id="viewForm">
  </fieldset>
</form>

但是因为它适用于所有其他浏览器，所以我真的看不出问题出在哪里...

Answer 1

问题解决了，原来是因为"disabled"标签。 Firefox 似乎是唯一不允许在 "disabled" div 中使用 "contentEditable" 的浏览器，所以我删除了它，现在我将它添加到每个 anwser 输入中，这样问题标题就不是禁用了。（我希望它是清楚的，如果不是很抱歉）

使用 innerHTML 的 Firefox contentEditable 问题

Firefox contentEditable issue using innerHTML

html

javascript

firefox

contenteditable