HTML contenteditable列表：第一個列表項奇怪地行爲？

Question

所以我試圖做一個非常簡單的列表CONTENTEDITABLE用HTML，看起來像這樣：

<article contenteditable="true"> 

<p>Text in doc</p> 
<ol> 
<li><p>Text in first LI</p><p>Has another para</p> 
    <ol> 
     <li><p>Text in nested LI</p></li> 
     <li><p>Text in nested LI2</p><p>And then some</p></li> 
    </ol> 
</li> 
<li><p>Text in second LI</p></li> 
</ol> 

</article> 

在基於Webkit的瀏覽器，如果你有一個發揮與它周圍，你會發現它非常合理，將段落當你點擊回車，刪除列表項，如果你打回退他們和類似的東西。

但是，如果您嘗試刪除列表中的第一項（雖然列表中還有其他內容），但情況會變得很奇怪。你幾乎不能這樣做。事實上，它所做的是將文本移動到前一段落，併爲您留下一個空白的列表項目，您不能再去。

也許這是Webkit的一個缺陷，但Firefox的工作原理是一樣的......無論如何，任何人都可以提出解決方法嗎？我想如果我有一些JavaScript檢測，如果它是名單的第一個字符，那麼它至少會停止一些不直觀的行爲，但你仍然可以突出整個項目，並打del和仍然有一個無法訪問1.

我也試過讓他們divs和使用流血的邊緣鉻，相同的行爲。

請參閱http://jsfiddle.net/2Unmz/14/儘管它的行爲與在瀏覽器中的行爲不同。

Answer 1

儘管它是嵌套列表的推薦方法（http://developer.mozilla.org/en/HTML/Element/ol），但似乎應該在嵌入另一個列表之前結束列表項目。這個HTML工作多我怎麼會想到：

<p>Text in doc</p> 
<ol> 
<li><p>Text in first LI</p><p>Has another para</p></li><!-- Ending the LI now --> 
    <ol> 
     <li><p>Text in nested LI</p></li> 
     <li><p>Text in nested LI2</p><p>And then some</p></li> 
    </ol> 
<!-- This is where it used to be --> 
<li><p>Text in second LI</p></li> 
</ol> 

</article> 

所以看起來這不是一個好主意，做嵌套列表作爲mozilla.org建議，如果你想CONTENTEDITABLE做順理成章之事與您的文檔。