jquery入门

let canMove = false        let x=0,y=0;        $('.demo').mousedown(function(e) {            x = e.pageX - $('.demo').offset().left            y = e.pageY - $('.demo').offset().top            canMove = true        })        $(window).mouseup(function() {            canMove =false        })        $(window).blur(function() {            canMove=false        })        setTimeout(()=>{            alert(1)        },2000)        $(window).mousemove(function(e) {            e.preventDefault()            if(canMove) {                let left = e.pageX - x;                let top = e.pageY - y                               let maxLeft = $(window).innerWidth() - $('.demo').innerWidth()                let maxTop = $(window).innerHeight() - $('.demo').innerHeight()                let result = $.filterLeftAndTop(left,top,maxLeft,maxTop)                $('.demo').css({                    left: result.left,                    top:result.top                })            }        })

上面的代码是写一个简易的拖动框  其中写道鼠标抬起 移动 和失去焦点通过 声明一个canMove 的布尔值 来控制鼠标的拖动的功能是否能够使用

let maxLeft = $(window).innerWidth() - $('.demo').innerWidth()let maxTop = $(window).innerHeight() - $('.demo').innerHeight()

这里的代码既是控制拖动框的最大移动距离 当超过设定界限时 就会停止 无论用户怎么拖动鼠标都不会超出此界定范围