Question

以下是我的计划。在这里，我希望交换选定的div。当右键单击div时，第一个div将被选中，当左键单击另一个div时，两个div将互相交换。第一次所有div都能正常工作，下次当我们选择相同的div进行交换时，它将无法正常工作。请帮我解决这个问题...

提前致谢...

var asd = '';
$(document).ready(function () {
    $('.cell').mousedown(function (event) {
        switch (event.which) {
            case 1:
                //left
                animateDiv($(this));
                break;
            case 3:
                //right
                asd = $(this);
                $(this).css('border-color', 'red');
                break;
        }
    });

    function animateDiv(This) {
        var new_pos = This.offset();
        var pos = asd.offset();
        asd.css('border-color', 'yellow');
        asd.animate({
            left: new_pos.left - pos.left,
            top: new_pos.top - pos.top
        }, 2000, function () {});
        This.animate({
            left: pos.left - new_pos.left,
            top: pos.top - new_pos.top
        }, 2000, function () {

        });
        asd = '';
    }
});

FIDDLE

Answer 1

您的div位于表格单元格中，offset相对于父表格单元格返回偏移量。 Div不改变他们的细胞，他们只是改变位置。

所以可能的解决方案是：

不要为此目的使用表格

OR

将div也物理移动到目标表格单元格。

我更喜欢没有表格的第一个解决方案。

查看更新的JSFIDDLE。我改变了：

函数placeCells以使用其初始位置呈现div
.cell元素的位置absolute
使用position jquery函数代替offset
更改了left和top animate的选项

Div交换不正常

1 个答案: