javascript - 如何使用jquery用鼠标移动div？

Question

我需要能够用鼠标移动一个 div 并将 div 的新位置存储在数据库中以记住显示。我该怎么做？

Answer 1

我强烈建议您查看 jQuery UI和可拖动的交互。基本上，您需要将代码添加到可拖动的 div(假设它具有 id="draggable"):

$("#draggable").draggable();

然后，将你必要的行为放在停止事件中。更具体地说，你会这样做:

$('#draggable').draggable({
    stop: function(event, ui) { ... }
});

至于数据库存储，你可以在上面的函数中使用AJAX调用，或者你可以将它存储在页面中，这样一些表单发送或其他操作导致位置信息被传递到服务器并存储与其他数据内联。我会小心使用 AJAX 调用，因为您可能会在每个浏览器上每次拖动时用位置数据轰炸您的数据库。取决于您的应用...