如果要設定物體拖拽，那麼必須使用三個事件，並且這三個事件的使用順序不能顛倒。
1.onmousedown：滑鼠按下事件
2.onmousemove:滑鼠移動事件
3.onmouseup:滑鼠抬起事件
拖拽的基本原理就是根據滑鼠的移動來移動被拖拽的元素。滑鼠的移動也就是x、y座標的變化；元素的移動就是style.position的top和left的改變。當然，並不是任何時候移動滑鼠都要造成元素的移動，而應該判斷滑鼠左鍵的狀態是否為按下狀態，是否是在可拖拽的元素上按下的。
基本思路如下：
拖拽狀態 =0滑鼠在元素上按下的時候滑鼠在元素上移動的時候
滑鼠在任何時候放開的時候
原聲js實現拖拽功能
1.給個div，給定一些樣式
按住拖動
//獲取dom元素
let dragdiv = document.getelementsbyclassname("drag")[0];
//滑鼠按下事件 處理程式
let putdown = function
(event)
if (parseint(dragdiv.style.top) <= 0)
if (parseint(dragdiv.style.left) >= window.innerwidth -parseint(dragdiv.style.width))
if (parseint(dragdiv.style.top) >= window.innerheight -parseint(dragdiv.style.height))
}//滑鼠抬起時，清除繫結在文件上的mousemove和mouseup事件
//否則滑鼠抬起後還可以繼續拖拽方塊
document.onmouseup = function
() }
//繫結滑鼠按下事件
dragdiv.addeventlistener("mousedown", putdown, false);
**：
使用js實現拖拽功能
通過監聽mousemove和mouseup事件實現拖拽功能 var screenwidth document.documentelement.clientwidth var screenheight document.documentelement.clientheight document mou...
js拖拽功能
html css mod mod hd mod corner jsvar mod document.getelementbyid mod var hd document.getelementbyid hd var corner document.getelementbyid corner funct...
JS 原生js實現拖拽功能基本思路
如果要設定物體拖拽，那麼必須使用三個事件，並且這三個事件的使用順序不能顛倒。onmousedown 滑鼠按下事件 onmousemove 滑鼠移動事件 onmouseup 滑鼠抬起事件 拖拽的基本原理就是根據滑鼠的移動來移動被拖拽的元素。滑鼠的移動也就是x y座標的變化 元素的移動就是style.p...