如何检测运动约束从左到右的阻力？

Question

我想检测静态（无运动）元素上的拖动事件的方向。 根据我的搜索，他们使用jquery-ui draggable元素将移动。

这是我的尝试（我使用containment阻止其移动，但随后我无法检测到拖动方向）

 var prevX = -1; $('div').draggable({ containment: "parent", drag: function(e) { //console.log(e.pageX); if (prevX == -1) { prevX = e.pageX; return false; } // dragged left if (prevX > e.pageX) { alert('dragged left'); } else if (prevX < e.pageX) { // dragged right alert('dragged right'); } prevX = e.pageX; } }); 

 .wrapper { width: 100px; height: 100px; } .inside { width: 100px; height: 100px; background-color: yellow; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> <div class="wrapper"> <div class="inside"></div> </div> 

Answer 1

使用dragstart保存开始位置XY，使用end dragend比较