如何设置jquery UI可拖动的起始位置

Question

我正在使用 jQuery UI 和 isotope，isotope 对元素的定位做了很多事情，并且弄乱了拖动元素的起始位置。

当我开始拖动时，我试图拖动的元素显示在父元素的左上角，而不是光标下方。

我查看了“开始”函数，并从事件中获得了正确的 x,y 坐标，但我似乎无法将这些值应用于克隆的可拖动项目。

我的代码是这样的

jQuery('div.item').draggable({ 助手：函数（事件，用户界面）{ jQuery('div.hold_items').isotope('destroy'); var item_dragged = jQuery(this).clone().appendTo('body').css({'z-index':500,'top':event.clientY, 'left':event.clientX}); 开始同位素（）； 返回配方_拖动； } });

我必须执行开始/停止同位素来解决同位素破坏可丢弃功能并且物品不知道它们被丢弃在哪里的问题。

我确定有一种方法可以设置可拖动的起始位置，但我似乎无法在文档中找到它，只是一种开始的方法。

Answer 1

发布我的答案是因为我在其他任何地方都找不到答案- 我遇到了您描述的问题，我以这种方式解决了它.. 定位助手（它将尝试重置为 0,0） 然后我们在它重置为 0,0 之前返回 false 它被取消并且在正确的位置，但是我们通过复制用于启动拖动的事件来重新开始拖动。

$(" #container").droppable({
drop: function (event, ui) {
    $(ui.draggable).detach().css({
        top: 0,
        left: 0
    }).appendTo(this);

}
});

$(" #draggable").draggable({
start: function (event, ui) {
    if ($(event.target).parent().is('.ui-droppable')) {
        var x = ($(this).offset().left);
        var y = ($(this).offset().top);
        var p = $(event.target).parent().parent();
        $(event.target).detach().insertAfter(p);
        $(ui.helper).css({
            'left': x - $(event.target).offset().left,
            'top': y - $(event.target).offset().top
        });
        var eventCopy = document.createEvent("MouseEvents");
        eventCopy.initMouseEvent(event.type, event.bubbles, event.cancelable, event.view, event.detail,
        event.pageX || event.layerX, event.pageY || event.layerY, event.clientX, event.clientY, event.ctrlKey, event.altKey,
        event.shiftKey, event.metaKey, event.button, event.relatedTarget);
        ui.dispatchEvent(eventCopy);
        return false;
    }
}
});

Answer 2

对于 jquery，您可以尝试使用 event.pageX 和 event.pageY 解释 here。