Javascript 防止将图像拖出contentEditable=false包装器

使用Firefox（其他浏览器可能需要其他特定的解决方案，目前我只搜索Firefox），给出以下代码：

<p contentEditable="true" >
    Some text in the content ...
    <span contentEditable="false" style="border:1px dotted gray">-not editable <img src="test.jpg"> end-</span>
    and some more text after it
</p>

内容中的一些文本。。。
-不可编辑的结束-
后面还有一些文字

如果用户试图从文本开始拖动不可编辑的部分，则会选中所有跨距并在内容中正确拖动，但如果用户单击图像，则跨距将保持在其位置，并将图像副本（带有环绕跨距）拖动到放置点

使用dragstart事件，如果目标是图像，我可以停止事件，但是：有没有办法选择整个范围，以便正确地拖动它

---

问题不在于如何使用DOM选择节点，而在于如何使拖放像一个完整的实体一样工作，而不会在起点是图像或创建图像副本时被阻止。

有人回答了，但随后删除了答案（或者我可能梦见了答案），但答案是，在图像上使用z-index:-1不会被拖动