jQueryUI 可删除 : over and out callback firing out of sequence

标签 jquery jquery-ui jquery-ui-droppable

已更新

js fiddle (已更新)here

我想知道,拖动的元素是否在任何列内?

当我从左到右拖动时,它对我有用,但当我从右到左拖动时,它不起作用。

enter image description here

jS

var isOutside = true;

$('.drag').draggable({
    helper : 'clone',
    drag : function(e, ui){
        if(isOutside)    
           return;
        //here is my code;
    },
});

$('.column').droppable({

    over : function(){
        isOutside = false;
        $('p').text('dragging inside');
    },
    out : function(){
         isOutside = true;
         $('p').text('dragging outside');
    }
});

最佳答案

发生这种情况的原因很可能是鼠标不是沿着连续的路径移动,而是跳跃。当您缓慢移动它时,每次都会跳跃一两个像素,因此您不会注意到它。当你疯狂地挥动它时,你可以在民意调查之间跳跃超过 100 像素。

由于您的鼠标现在位于其他物体上,因此该事件首先触发是正常的,然后当浏览器循环 catch 时,也会检测到 out 事件。人们可以说 over 事件的“重要性”更高,因为它是回调(鼠标移动)而不是民意调查(我周围还有什么?)。

如果您希望某些事情发生并取决于这些事件的顺序,我建议您检查您的 over任何out的处理程序在处理over之前采取行动事件。基本上你这样做:

  1. 在第一次结束事件(变量为空)时保存当前元素。
  2. 在变量不是当前元素的下一个 over 事件中,处理旧元素的 out 事件并将变量设置为当前悬停的元素。
  3. 在 out 事件上处理 out 并将元素设置为 null。

这会给你一个强制的事件顺序,即使实际的 over发生在前面的输出之前。

您还可以使用out仅跟踪的事件是鼠标离开所有放置区域并在那里进行一些重置。并使用 over事件来处理所有拖放区域中的拖动...

关于jQueryUI 可删除 : over and out callback firing out of sequence,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15355553/

相关文章:

php - 如果在多选中选择了指定值之一,则显示 div

javascript - 从下拉选择中选择特定选项时选中相应的复选框?

javascript - Jquery Sortable inside other sortable : On sorting the element how to detect which sortable moved child or parent

Jquery 衬衫设计师 - 如何?

javascript - 为可放置事件添加延迟

javascript - imgAreaSelect JQuery插件Resizable Div的最小宽高

javascript - 使用jquery从ul列表中提取 anchor 标记链接

响应窗口大小的 jquery 可调整大小的栏

javascript - 我不明白为什么我的 JQuery UI 菜单中的幻灯片缺少几个像素

javascript - 追加后,使可拖动元素相对于可放置元素的坐标