Question

当我运行时

$('#tgsBox1').droppable({
    accept: "#tgsSquirrel",
    drop: function(e, ui) {
        ui.draggable.animate({
            left: $(this).position().left + 25,
            top: $(this).position().top + 131
        }).destroy();
    }
});

可拖动元素实际上已被破坏（不再可拖动）但它会出错：

TypeError: ui.draggable.animate(...).destroy is not a function
ui.draggable.animate({

看起来类似于旧线程：jquery ui error for ui.draggable("destroy")，但假定的解决方案（更新jQuery-ui）并没有对此进行排序。

Answer 1

在jQuery ui dragglable小部件中调用方法的语法是：

$( ".selector" ).draggable( "method" );

destroy：$( ".selector" ).draggable( "destroy" );

尝试按如下方式调用方法：

$('#tgsBox1').droppable({
  accept: "#tgsSquirrel",
  drop: function(e, ui) {
    ui.draggable.animate({
        left: $(this).position().left + 25,
        top: $(this).position().top + 131
    }).draggable("destroy");
  }
});

它不再可拖动的原因可能是因为错误导致脚本执行停止。

您可能希望在动画完成后销毁可拖动：

$('#tgsBox1').droppable({
  accept: "#tgsSquirrel",
  drop: function(e, ui) {
    ui.draggable.animate({
        left: $(this).position().left + 25,
        top: $(this).position().top + 131
    },function(){
       ui.draggable.draggable("destroy");
    });
  }
});

jQuery droppable对象执行destroy（）但抛出错误

1 个答案: