如果元素具有特定类,则禁用jQuery UI draggable

Ben*_*rey 4 html javascript jquery jquery-ui draggable

我有一个交互式篮子,用户可以将物品拖放到篮子里.但是,相同的物品不能放在篮子里两次(但它仍然可见,虽然已经褪色),所以一旦它在篮子里,draggable必须禁用该属性.

我试过这样做:

$("#product_badges li:not(.on)").draggable({
    // Options here
});
Run Code Online (Sandbox Code Playgroud)

但是,因为这只是启动draggable()属性,即使我确实将该on类添加到该属性,该元素仍然可以拖动dropped.

因此,我没有看到一种实现这一目标的方法,如果没有draggable像这样的属性的几个实例:

$("#product_badges li:not(.on)").each(function(){
    $(this).draggable({
        // Options here
    }
});
Run Code Online (Sandbox Code Playgroud)

通过上面的方法,我可以调用个人product_badge并禁用拖动,如下所示:

只有将物品放入篮子后才会调用此选项(掉线)

$('.item',$('#product_badges')).draggable('disable');
Run Code Online (Sandbox Code Playgroud)

有没有更好的方法来实现这一目标?您是否可以将HTML元素设置为只有在没有特定类的情况下才可以拖动?

更新

请参见此处的示例:http://jsfiddle.net/mB6GK/2/

Lyn*_*ley 6

使用该cancel属性.

$("#product_badges li").draggable({ cancel: ".no" })
Run Code Online (Sandbox Code Playgroud)

小提琴:

http://jsfiddle.net/sGguz/