Jquery диапазон выбора предыдущего элемента на contenteditable = "false"

Question

У меня есть этот фрагмент:

<div contenteditable="true"> father
      <a contenteditable="false" href="#"> myLink </a>
</div>

Моя проблема в том, что если я поставлю каретку после

</a> 

и я пытаюсь вернуться назад для удаления html-тега myLink, он не работает в Firefox, но работает в Chorme, Opera, Safari и Explorer. Другой рукой, если в Firefox я выбираю

<a contenteditable="false" href="#"> myLink </a>

и затем удалите его с помощью backspace !.

Возможное решение: выбор диапазона элемента

<a contenteditable="false" href="#"> myLink </a>

программно, когда пользователь нажимает клавишу Backspace.

Как я могу сделать это в jquery? Если курсор вставки находится после

</a>

и пользовательские цифры возврата, я хочу выбрать

<a contenteditable="false" href="#"> myLink </a>

и удалите этот узел.

Answer 1

Добавьте тег span с contenteditable = true, как показано ниже,

<a contenteditable="false" href="#"><span contenteditable="true"> myLink </span></a>

Проверьте jsFiddle здесь,

Я тестировал его в FF, IE 8 и Chrome и удалось удалить с помощью backspace, но опыт пользователя отличается в FF и других браузерах.

Я не уверен, что это лучший способ сделать это.

Редактировать: Похоже, что на это уже ответили здесь