contenteditable span 在 .sortable <li> 中不起作用，但在 <li> 之外起作用 - firefox答案

【问题标题】：contenteditable span does not work in .sortable <li>, but does outside of <li> - firefoxcontenteditable span 在 .sortable <li> 中不起作用，但在 <li> 之外起作用 - firefox
【发布时间】：2011-12-15 21:31:32
【问题描述】：

使用 firefox，contenteditable="true" 似乎在使用 .sortable ui 插件可排序的 li 中不起作用。

HTML：

<p id="hello" contenteditable="true">this is editable</p>
<ul>
  <li><span contenteditable="true">this is not</span></li>
  <li><span contenteditable="true">neither is this</span></li>      
</ul>

Js：

$("ul").sortable();

您可以编辑第一个<p>，但不能编辑<li> 中的任何<span>。这是在 Firefox 中。它适用于 Chrome。

有什么想法吗？

所有这些代码也在这里：http://jsbin.com/onosir/2/edit

【问题讨论】：

除非我单击列表项图标和实际文本之间的空白，否则它在我的 chrome 中不起作用。如果我直接点击文字，没有乐趣。

标签： jquery jquery-ui jquery-ui-sortable

【解决方案1】：

span 中的内容一旦获得焦点就可以进行编辑。这可能是 sortable 的 mousedown 方法不允许跨度获得焦点。尝试在这些情况下使用句柄。

【讨论】：