在jQuery

时间:2017-07-12 01:55:04

标签: javascript jquery

我可以使用下面的代码在vanilla js中实现取消检测。

el.addEventListener('dragend', event => {
  let cancelled = event.dataTransfer.dropEffect === 'none';
  if(cancelled) {
    // do something when drag cancelled.
  }
}, false);

但是在尝试将此代码段转换为jQuery版本时失败了,因为jQuery将事件包装到不具有dataTransfer属性的jQuery事件中。

el.on('dragend', event => {
  console.log(event.dataTransfer); // => undefined
});

我想知道如何使用jQuery检测拖动取消 顺便说一句,我没有使用jQuery UI,但我想尝试一下,如果事情会变得更容易。

1 个答案:

答案 0 :(得分:2)

您可以使用jQuery事件的.originalEvent属性来获取.dataTransfer属性

$("div")
.on("dragend", function(e) {
  console.log(e.originalEvent.dataTransfer)
})
div {
  padding: 8px;
  margin: 8px;
  border: 1px solid blue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<div draggable>drag</div>
<div droppable>drop</div>