Backspace не удаляет внутренние html-тэги contenteditable DIV в Firefox

Question

Я создал DIV с атрибутом contenteditable = true и добавил детей, таких как «span» и «a» с атрибутами contenteditable = false. Хотел проверить, удаляется ли весь узел с одним возвратом, и, к моему удивлению, Firefox не смог удалить элементы. Также это работает, как и ожидалось, во всех основных настольных браузерах, кроме Firefox. Есть ли какие-либо подсказки по этому поводу или что может быть возможным обходным путем?

Найдена точная проблема на bugzilla здесь .

Answer 1

Хорошо! нашел решение ... это довольно просто, чем вы думаете. Я на самом деле вставляю html для ссылок, поэтому использую <a> здесь. Тег <a> имеет атрибут, установленный на contenteditable = false, и он не удаляется с помощью возврата. Итак, я создал внутренний <span> уровень с contenteditable = true для firefox, и это помогло.

<div contentEditable="true">
   <a href="your/url/path" contentEditable="false">
     <span contentEditable="true">link here</span>
   </a>
</div>

Это требуется только в Firefox. Другие браузеры обрабатывают это, как и ожидалось, с диапазоном содержимого contenteditable = false.