Question

我有这个jQuery：

$(".com-bg-td").each(function (index) {
    $(this).droppable({
        accept: ".avail_pc_list",
        hoverClass: "cell-highlght",
        tolerance: "pointer",
        drop: function (event, ui) {
            var droppableId = $(this).attr("id");
            var dragged = $(ui.draggable).attr("id");
            dropped(droppableId, dragged);
            $(this).removeClass("com-bg-td").addClass("cell-dropped");
        }
    });
});

jQuery用于拖动.avail_pc_list的元素但在函数dropped()之后我希望它不再接受.avail_pc_list，因为我删除了它。但它仍被接受。

Answer 1

这是因为一旦DOM元素被指定为droppable，你就无所事事了。只是改变类是行不通的，因为这与droppability无关，它恰好是你修改元素的初始选择器句柄。

您需要将代码修改为：

$(this).droppable('destroy').removeClass("com-bg-td").addClass("cell-dropped");

请注意，如果您认为可能希望在droppable('disable')的某个位置再次启用该功能，也可以使用droppable('enable')而不是销毁。

这也是jQuery的一个很好的一般教训。选择器实际上只是一种向DOM查询要使用的元素的方法。您可以进行修改，例如将droppable应用于DOM元素本身。此功能将持续存在，直到您执行某些操作将其删除。添加像这样的onclick处理程序就可以很容易了：

$('.someClass').click(function() { ... });
$('.someClass').addClass('someOtherClass').removeClass('someClass');
$('.someOtherClass').click(); // will trigger click handler bound to these elements when they were classed as someClass even though they no longer have that class.

如果使用委托事件（例如使用on()），当然不会是这种情况。

$('#someContainer').on('click', '.someClass' function() { ... });
$('.someClass').addClass('someOtherClass').removeClass('someClass');
$('.someOtherClass').click(); // would not trigger click function since the binding was actually made against #someContainer and the someClass has been removed everywhere

.addClass并删除现有的

1 个答案: