修改 jQuery 函数中涉及的 DOM 元素

Question

具体来说，使用 jQuery 进行拖放。

                        $(".note").droppable({
                            drop: function () {

                            }
                        });

如何获取 DOM 元素：

1) 是否被拖/放？

2) 被扔到上面了吗？

跟进问题：有什么建议可以让我自己回答这个问题吗？

Answer 1

如果您将可拖动对象的drop 事件与接受两个参数event 和ui 的函数挂钩，那么this 是拖放对象的原始DOM 元素，而@987654327 @ 是可拖动的。

来自the docs on the drop event：

当接受的可拖动对象被放置在此可放置对象的“上方”（在其容差范围内）时，将触发此事件。在回调中，$(this) 表示可拖放的可拖放对象。 ui.draggable 代表可拖动。

他们说droppable 是$(this)，但那是因为他们假设你想要一个包裹它的jQuery 实例。 this 将是原始 DOM 元素。

例如：

$("your selector here").droppable({
    drop: function(event, ui) {
        // this = raw DOM element of droppable
        // $(this) = creates jQuery wrapper around the DOM element
        // `ui.draggable` = draggable

        // Let's make the draggable red, and the droppable blue:
        ui.draggable.css("color", "red");
        $(this).css("color", "blue");
    }
});

Here's a live copy 上面的例子之一。