javascript - jQuery-单击并拖动屏幕上的div，而无需拖动

我目前正在研究一个具有可拖动div的小项目。我创建的代码似乎无法正常工作，它导致JQuery停止响应。

有没有不使用.draggable的好方法吗？

var hold = false;
        //Drag Elements

        $('#example').mousedown(function(){
            hold = true;
        });

        $('#example').mouseup(function(){
            hold = false;
        });

        $(document).on('mousemove', function(e){
            $('#example').css({
                while(hold){
                    left:   e.pageX-50,
                    top:    e.pageY-50
                }
            });
        });

谢谢

最佳答案

由于Javascript是单线程的，因此您的while循环永远不会退出，因为mouseup处理程序在卡在mousemove处理程序中时无法运行。

将while更改为if：

    $(document).on('mousemove', function(e){
        if (hold) {
            $('#example').css({
                left:   e.pageX-50,
                top:    e.pageY-50
            });
        }
    });