JQuery OnDrag 在悬停时触发点击

Question

我有一个使用 JQuery UI onDrag 和 onDrop 的拖放应用程序。此应用程序是一个带有选项卡的房间预订系统。我已经完美地完成了 drop-working，但有一个功能是我真正想要的（如果可能的话）。

有没有办法为选项卡创建一个事件处理程序，它只在您拖动元素时触发？

例子：你想把一个人从Tab1移动到Tab2，不点击标签，你只能拖动这个人->悬停标签->然后点击标签。

Answer 1

没有用于拖动元素的特定事件处理程序，但通过操纵其他事件，您可以使其工作。

诀窍是使用 mousemove 事件，但仅当鼠标在可拖动元素上按下时才起作用。因此，我们在mousedown事件中做某一个布尔值true，然后在mouseup事件中做成false。 mousemove 事件检查布尔值是否存在，当且仅当布尔值是 true.

时才运行它的代码

这是一个例子：

$(document).ready(function() {
    //Make draggable draggable
    $("#draggable").draggable();
    //mousedown and mouseup Boolean
    var drragging = false;
    $("#draggable").mousedown(function() { dragging = true; });
    $("#draggable").mouseup(function() { dragging = false; });
    //mousemove event -> mousedrag event
    $("#draggable").mousemove(function() { if (dragging) {
        //The event:
        $("#draggable").css("color", "rgb("+Math.round(255*Math.random())+", "+Math.round(255*Math.random())+", "+Math.round(255*Math.random())+")");
    }});
});

<span id="draggable">Drag me!</span>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>

JQuery OnDrag 在悬停时触发点击

JQuery OnDrag fire a click when hovered

javascript

jquery

drag-and-drop

jquery-ui

draggable