使用jQuery UI删除成功时可删除的功能

Question

我有以下代码,允许您在页面上拖放元素,并成功删除它运行一个名为saveRatings的方法传递元素的ID.

            $('.draggable').draggable({
                revert: true
            });


            $('.droppable').droppable({
                drop: function( event, ui ) {
                    draggedID = ui.draggable.attr("id");
                    droppedID = $(this).attr("id");
                    Global.showLoader('Saving...');
                    quiz1.saveRatings(draggedID, droppedID);
                }
            });

计划是,一旦成功删除,它将删除被拖动的项目并从被删除的元素中删除droppable类,以防止其他元素也被丢弃:

saveRatings: function ( choiceId, ratingId ) {

                // Hide the dragged choice
                $('div#' + choiceId).hide();

                // Remove droppable behaviour
                $('div#' + ratingId).removeClass('ui-droppable');
                $('div#' + ratingId).removeClass('droppable');
                $('div#' + ratingId).addClass('done');

}

删除部分工作正常,删除类但元素仍然允许其他人被删除...即使我已从元素中删除了droppable和ui-droppable类...

任何想法为什么这不起作用？我无法显示一个小提琴,因为完整的代码库相当大(但不会直接影响这个)但是上面的例子应该足以解释这个问题,希望有一个解决方案.

Answer 1

用途disable:

$('#' + ratingId).droppable('disable')

此外,您无需指定'div#'何时按ID选择,因为ID是唯一的.

演示(使用销毁)

Answer 2

您可以使用:

$('#' + ratingId).droppable('destroy')

这将永久删除元素中的可放置行为.如果要重新初始化它,只需使用与首次初始化时相同的初始化代码再次使元素可以删除.

有关更多信息,请参阅文档:http://api.jqueryui.com/droppable/#method-destroy