Question

我有一个问题：如果我限制了dragOver函数，为什么除了节流超时外，一直都有闪烁的停止信号出现？

抑制拖曳的正确方法是什么？我对此做了一个简单的演示（chrome 68.0.3440.106）

$(document).on("dragover", ".nest-source.throttle", $.throttle( 100, 
    true,function(e) {
    console.log("throttling");
    e.preventDefault();
}))


$(document).on("dragover", ".nest-source.nothrottle", function(e) {
    console.log("wo throttling");
    e.preventDefault();
})

Answer 1

要允许放置该元素，您需要在事件上调用preventDefault。无论是否进行节流，都会触发事件，如果不调用preventDefault方法，则会显示拖动块图标。 $ .throttle的作用是创建一个新函数，该函数检查自上次执行回调以来已过去了多少时间，并且仅在指定的持续时间过去后才触发回调。因此，您每100ms只允许一次下降，这就是图标闪烁的原因。

您在云上做类似

const throttledDragOver = (duration, callback) => {
    var throttledCallback = $.throttle(duration, true, () => callback());
    return e => {
    e.preventDefault();    
    throttledCallback();
  }
}

您可以在操作中here看到它

HTML5 DragOver节流

1 个答案: