如何禁用jQuery draggable,例如在UpdatePanel回发期间?
答案 0 :(得分:143)
可以创建DisableDrag(myObject)和EnableDrag(myObject)函数
myObject.draggable( 'disable' )
然后
myObject.draggable( 'enable' )
答案 1 :(得分:64)
要暂时禁用可拖动行为,请使用:
$('#item-id').draggable( "disable" )
要永久删除可拖动行为,请执行以下操作:
$('#item-id').draggable( "destroy" )
答案 2 :(得分:18)
在我使用的jQuery中启用/禁用draggable:
$("#draggable").draggable({ disabled: true });
$("#draggable").draggable({ disabled: false });
@Calciphus的回答对我来说不适用于不透明度问题,所以我使用了:
div.ui-state-disabled.ui-draggable-disabled {opacity: 1;}
也可以使用移动设备。
答案 3 :(得分:11)
我花了一些时间来弄清楚如何在drop-use ui.draggable
上禁用draggable来引用从drop函数中拖动的对象:
$("#drop-target").droppable({
drop: function(event, ui) {
ui.draggable.draggable("disable", 1); // *not* ui.draggable("disable", 1);
…
}
});
HTH某人
答案 4 :(得分:9)
使用指定的禁用选项初始化一个draggable。
$( ".selector" ).draggable({ disabled: true });
在初始化后获取或设置禁用选项。
//getter
var disabled = $( ".selector" ).draggable( "option", "disabled" );
//setter
$( ".selector" ).draggable( "option", "disabled", true );
答案 5 :(得分:7)
对于对话框,它有一个名为draggable的属性,将其设置为false。
$("#yourDialog").dialog({
draggable: false
});
尽管问题已经很久了,但我尝试了所提出的解决方案并且它对于对话框不起作用。希望这可以帮助像我这样的人。
答案 6 :(得分:3)
以下是.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
});
答案 7 :(得分:3)
我有一个简单而优雅的解决方案,不会弄乱类,样式,不透明和东西。
对于可拖动元素 - 添加'start'事件,每次尝试将元素移动到某处时都会执行该事件。你将有一个移动不合法的条件。对于非法移动 - 使用'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();
}
}
});
欢迎你:)
答案 8 :(得分:0)
从
更改draggable
属性
<span draggable="true">Label</span>
到
<span draggable="false">Label</span>