javascript - HTML5，可拖动和 contentEditable 不能一起工作

Question

当 draggable在父元素上启用了属性(<li>)我无法制作contenteditable处理它的子元素 ( <a> )。

焦点转到子元素 ( <a> )，但我根本无法编辑它。

请检查此示例

http://jsfiddle.net/pavank/4rdpV/11/

编辑:我可以在禁用 draggable 时编辑内容在 <li>

Answer 1

我今天遇到了同样的问题，[使用 jQuery] 找到了解决方案

$('body').delegate('[contenteditable=true]','focus',function(){
    $(this).parents('[draggable=true]')
            .attr('data-draggableDisabled',1)
            .removeAttr('draggable');
    $(this).blur(function(){
        $(this).parents('[data-draggableDisabled="1"]')
                .attr('draggable','true')
                .removeAttr('data-draggableDisabled');
    });
});

$('body') 可以替换为任何更具体的内容。

如果在运行时没有添加新的contenteditable元素，可以使用bind代替delegate。