如何禁用可拖动的jQuery UI？

如何禁用jQuery可拖动对象，例如在UpdatePanel回发期间？

可以创建DisableDrag（myObject）和EnableDrag（myObject）函数

myObject.draggable( 'disable' )

然后

myObject.draggable( 'enable' )

要暂时禁用可拖动行为，请使用：

$('#item-id').draggable( "disable" )

要永久删除可拖动行为，请使用：

$('#item-id').draggable( "destroy" )

要在jQuery中启用/禁用可拖动，我使用了：

$("#draggable").draggable({ disabled: true });          

$("#draggable").draggable({ disabled: false });

@Calciphus的答案不适用于不透明性问题，因此我使用了：

div.ui-state-disabled.ui-draggable-disabled {opacity: 1;}

也可以在移动设备上工作。

这是代码：http : //jsfiddle.net/nn5aL/1/

使能禁用可拖动的jQuery的不透明问题html

我花了一些时间弄清楚如何禁用放置时的可拖动性-用于ui.draggable引用从放置功能内部拖动的对象：

$("#drop-target").droppable({
    drop: function(event, ui) {
        ui.draggable.draggable("disable", 1); // *not* ui.draggable("disable", 1);
        …
    }
});

有人

似乎没有人看过原始文档。当时可能没有））

使用指定的禁用选项初始化可拖动对象。

$( ".selector" ).draggable({ disabled: true });

初始化后获取或设置禁用的选项。

//getter
var disabled = $( ".selector" ).draggable( "option", "disabled" );
//setter
$( ".selector" ).draggable( "option", "disabled", true );

对于对话框，它具有一个称为draggable的属性，请将其设置为false。

$("#yourDialog").dialog({
    draggable: false
});

即使问题很老，我还是尝试了建议的解决方案，但该方法不适用于该对话框。希望这可以帮助像我这样的人。

以下是里面的样子 .draggable({});

$("#yourDraggable").draggable({
    revert: "invalid" ,
    start: function(){ 
        $(this).css("opacity",0.3);
    },
    stop: function(){ 
        $(this).draggable( 'disable' )
    },
    opacity: 0.7,
    helper: function () { 
        $copy = $(this).clone(); 
        $copy.css({
            "list-style":"none",
            "width":$(this).outerWidth()
        }); 
        return $copy; 
    },
    appendTo: 'body',
    scroll: false
});

我有一个简单而优雅的解决方案，不会混淆类，样式，不透明性和其他东西。

对于可拖动元素-您添加“开始”事件，该事件将在您每次尝试将元素移动到某处时执行。您将有一个不合法举动的条件。对于非法移动，请使用'e.preventDefault（）;'阻止它们 就像下面的代码一样。

    $(".disc").draggable({
        revert: "invalid", 
        cursor: "move",
        start: function(e, ui){                
            console.log("element is moving");

            if(SOME_CONDITION_FOR_ILLEGAL_MOVE){
                console.log("illegal move");
                //This will prevent moving the element from it's position
                e.preventDefault();
            }    

        }
    });

别客气 ：）

draggable从更改属性

<span draggable="true">Label</span>

至

<span draggable="false">Label</span>