为什么在调用.css（）方法后div没有更新？

Question

当我完成拖动div时，我想将其放回到以前的位置，存储在data-x，data-y中。但jQuery不会在“up”方法中修改$(".current")：

• 正确存储data-x，data-y，
• 使用oX，oY，
正确显示存储的值
• 但最终值始终是来自mousemove的值，即使在mousemove之后调用“up”方法。

代码：

$(window).on('mouseup', function(){
    if (dragDown){
        var oX = $(".current").attr("data-X");
        var oY = $(".current").attr("data-Y");
        console.log("oXY: "+oX+", "+oY); //<--- works fine
        $(".current").css({"top":oY, "left":oX}); //<--- does not work

        console.log("up: "+$(".current").css("top")+", "+$(".current").css("left"));
    }
    dragDown = false;
});
$(".draggable").on('mousemove', function(e){ //<--- .draggable
    if (dragDown){
        //...
        console.log("move: "+$(".current").css("top")+", "+$(".current").css("left"));
        $(".current").css({"top":resultY, "left":resultX}); //<---works fine   
    }
});


<div id="containerDrag">
    <div id="drag" class="draggable current">
    </div>
</div>

因此，在鼠标操作之后，div保持原样，而不是返回存储在data-x，data-y中的值。

输出结果为：

move: 16.6875px, 128px
move: 15.6875px, 130px
move: 15.6875px, 131px
oXY: 81, 21.6875
up: 15.6875px, 132px

和元素控制台中的输出：值数据和样式应该相同：

Answer 1

所以我想我有你的答案：

$(".current").css({"top":oX + "px" , "left":oY + "px"});

对不起，我不能告诉你为什么，在你的其他功能中，变量必须略有不同？

https://jsfiddle.net/rf5up5fr/52/