在拖动一些html元素后,我需要它来复制自身,更改某些内容,使jQuery UI可拖放,并与鼠标光标一起移动,直到jQuery释放鼠标为止。
到目前为止,我成功地克隆、修改并执行了可拖动的操作(请参阅http://jsfiddle.net/meridius/qdVue),无论我做什么,我都无法使它移动。
我们很感激你的帮助。
发布于 2013-10-29 13:38:11
您需要做的是将全局变量设置为当前对象,并监视元素(或文档)的MouseMove事件,并将元素的左/顶位置设置为鼠标的位置。
var currentObj = null;
$(".js-factory")
.on("mousedown", ".js-form .js-base", function (event) {
var figurka = $(this).clone(false).addClass("figurka").draggable({
snapMode: "inner",
snapTolerance : 55
}).wrapInner("<div class='fig-wrap'></div>");
$(".js-park").append(figurka);
currentObj = figurka;
});
$(document).mousemove(function(e) {
if (currentObj) {
currentObj.css({'top':e.clientY - 20, 'left':e.clientX - 20});
}
});
$(document).on('mouseup', function() {
currentObj = null;
});在前面的代码中,我们将currentObj的值设置为figurka对象ou create的值,然后监视文档的mousemove事件,并将创建的对象移动到鼠标-20的位置。一旦mouseup事件发生在文档上,我们将currentObj重置为null。
编辑
在我的Fiddle中,似乎出现了一个奇怪的现象,为什么元素的位置不在鼠标上。这是由您的float:right;元素的base CSS属性造成的。
https://stackoverflow.com/questions/19659359
复制相似问题