HTML5,,draggable和contentEditable不能一起工作

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (17)

draggable父元素(<li>)上启用属性时,我无法contenteditable对其子元素(<a>)进行操作。

重点在于子元素(<a>),但我根本不能编辑它。

请检查此示例

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

提问于
用户回答回答于

尝试将这两个属性添加到锚标记中:

onfocus="this.parentNode.draggable = false;"
onblur="this.parentNode.draggable = true;"

将它添加到<a>标签在你的JsFiddle上。如果jQuery比获取ParentNode更复杂,也可以使用jQuery。

用户回答回答于

我今天遇到了同样的问题,找到了解决办法。使用 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

扫码关注云+社区