Javascript dragend和drop事件之间是否有定义的顺序?

Javascript dragend和drop事件之间是否有定义的顺序?,javascript,html,drag-and-drop,Javascript,Html,Drag And Drop,根据HTML5拖放API上的描述,当删除元素时会触发两个事件: 从放置目标触发drop事件 从拖动源触发dragend事件 在做一个简单的测试(参见代码片段)时,drop事件总是在dragend事件之前触发(至少在Chrome中是这样),但是我在规范中找不到关于这些事件顺序的任何信息 这些事件的顺序是否已定义,或者它们是否可以任意任意顺序触发 功能allowDrop(ev){ ev.preventDefault(); } 功能阻力(ev){ ev.dataTransfer.setData(“文

根据HTML5拖放API上的描述,当删除元素时会触发两个事件:

  • 从放置目标触发
    drop
    事件
  • 从拖动源触发
    dragend
    事件
  • 在做一个简单的测试(参见代码片段)时,
    drop
    事件总是在
    dragend
    事件之前触发(至少在Chrome中是这样),但是我在规范中找不到关于这些事件顺序的任何信息

    这些事件的顺序是否已定义,或者它们是否可以任意任意顺序触发

    功能allowDrop(ev){
    ev.preventDefault();
    }
    功能阻力(ev){
    ev.dataTransfer.setData(“文本”,ev.target.id);
    }
    功能下降(ev){
    log(“在“+Date.now()处放置”);
    ev.preventDefault();
    var data=ev.dataTransfer.getData(“文本”);
    ev.target.appendChild(document.getElementById(数据));
    }
    功能驱动(ev){
    log(“dragend at”+Date.now());
    }
    #第1部分{
    背景色:红色;
    高度:100px;
    宽度:100px;
    }
    #拖拉{
    背景颜色:绿色;
    高度:50px;
    宽度:50px;
    }
    将绿色方块拖动到红色方块中
    
    根据当前(2021年6月8日更新)HTML规范中的规定,
    drop()
    事件必须在
    dragend()事件之前触发

    相应的信息深入嵌套在文档中,但描述拖动操作结束的部分如下所示(省略和强调):

    否则,如果用户结束拖放操作(例如 在鼠标驱动的拖放界面中释放鼠标按钮), 或者,如果
    拖动
    事件被取消,则这将是最后一次 迭代。运行以下步骤,然后停止拖放 操作:

  • […]
    否则,拖动操作可能会成功;运行以下子步骤:
  • 让我相信这是真的
  • 如果当前目标元素是DOM元素,则向其激发名为
    drop
    的DND事件;否则,请使用特定于平台的 表示下降的约定
  • [……]
  • 在源节点激发名为dragend的DND事件
  • [……]

  • Firefox的顺序也一样