如何使用jQuery将HTML元素附加到鼠标上？

Question

我该如何使用jQuery将HTML元素附加到鼠标光标上？ 这应该类似于“可拖动”，但我希望该元素在双击鼠标后紧贴鼠标光标，并且在按下左键之前跟随鼠标光标。

- user1048261

---

请记住，这可能会让大多数用户感到困惑，因为他们习惯了大多数现代操作系统的点击、拖动和释放界面。 - Blazemonger

Answer 1

你需要使用 .mousemove() 和 .offset()。

$("#clickedElement").dblclick(function () {
    var $someElement = $("#elementToCling");
    $(document).mousemove(function (e) {
        $someElement.offset({ top: e.pageY, left: e.pageX });
    }).click(function () {
        $(this).unbind("mousemove");
    });
});

演示：http://jsfiddle.net/EbbxA/

- gilly3

---

备用演示：http://jsfiddle.net/a4eFE/，因为我感到无聊并且它看起来很酷。 - Joseph Marikle

谢谢！这就是我想要的。但是如果我想使用“可拖动”的选项，比如“吸附”、“还原”、“限制范围”等，该怎么做呢？ - user1048261

你需要修改jQueryUI插件的实际代码。看起来这不应该太难 - 只需找到绑定mousedown和mouseup的位置，并将其替换为dblclick和click。似乎这将是一个很方便的拖动功能内置。如果你成功了，请回帖告诉我们！ - gilly3