Firefox中超鏈接內部的可滿足跨度問題

Question

我有一個可滿足的跨度放置在<a>標記中。我希望能夠編輯跨度內的文本，因此，重要的是：

• 地方點擊鼠標上的光標停在某個跨度內
• 用鼠標
跨度內的文本的選擇部分

只要超鏈接中有href屬性（在我的情況下也需要），它們都不能在Firefox中工作。沒有這個屬性沒有問題，並且在Chrome中沒有問題。

請在JSFiddle上嘗試my example。

<ul> 
    <li> 
    <a href="#"> 
     <span contenteditable="true">PlacingCursorOrTextSelectionInFirefoxImpossible</span> 
    </a> 
    </li> 
    <li> 
    <a> 
     <span contenteditable="true">noProblemsHereSoFar</span> 
    </a> 
    </li> 
</ul> 

Answer 1

，你能做些什麼來提高點擊行爲是爲了防止它的傳播是這樣的：

<a href="#"> 
    <span contenteditable="true" onclick="event.stopPropagation();"> 
    PlacingCursorOrTextSelectionInFirefoxImpossible 
    </span> 
</a> 

不幸的是，這僅允許把光標span內，但它somewhy投入它的開始，而不是點擊的地方。

要啓用選擇，則需要防止拖拉的行爲，但它是可以改變的a元素：

<a href="#" draggable="false"> 
    <span contenteditable="true" onclick="event.stopPropagation();"> 
    PlacingCursorOrTextSelectionInFirefoxImpossible 
    </span> 
</a> 

但哇，居然draggable="false"固定「光標移至開頭」的錯誤！這裏的工作例子（在FF 47測試）：https://jsfiddle.net/8v1ebkfd/4/