Jquery 范围选择 contenteditable 上的上一个元素 ="false"

Question

我有这个片段:

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

我的问题是，如果我将插入符号放在

之后

</a> 

我尝试退格以删除myLink html标签，它在firefox中不起作用，但在chorme、opera、safari和explorer中起作用。另一方面，如果在 Firefox 中我选择

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

然后用退格键删除它就可以了!

可能的解决方法是元素的范围选择

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

当用户输入退格键时以编程方式进行。

如何在 jquery 中做到这一点？如果插入符号光标位于

之后

</a>

和用户数字退格键我想选择

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

并删除该节点。

Answer 1

添加一个带有 contenteditable=true 的 span 标签，如下所示，

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

检查jsFiddle在这里，

我在FF、IE 8和Chrome中测试过，可以用退格键删除，但在FF和其他浏览器中的用户体验是不同的。

我不确定这是否是最好的方法。

编辑:似乎已经回答了这个问题 here