dragstart 必须调用 dataTransfer.setData()，dragover 必须 preventDefault()，drop 必须 preventDefault() 并 getData()；移动端不支持原生 drag/drop，需用 touch 事件模拟或第三方库。
dragstart 事件必须设置 dataTransfer
没有 dataTransfer.setData()，后续的 dragover 和 drop 就不会触发——浏览器默认会忽略拖放行为。常见错误是只加了 draggable="true" 却忘了在 dragstart 里存数据。
实操建议：
立即学习“Java免费学习笔记（深入）”；
- 必须在
dragstart中调用event.dataTransfer.setData('text/plain', 'some-id')（类型和值可自定义） - 若想允许拖入目标区域，
dragover里必须调用event.preventDefault()，否则drop永远不触发 - 推荐用
'text/plain'或'application/json'类型，避免用'text/html'引发意外解析
drop 事件里要主动阻止默认行为
很多开发者以为只要监听了 drop 就够了，结果发现文件或链接被浏览器直接打开/下载——这是因为浏览器对 drop 有默认处理逻辑。
实操建议：
立即学习“Java免费学习笔记（深入）”；
-
drop回调中第一行必须写event.preventDefault() - 再通过
event.dataTransfer.getData('text/plain')取出之前存的数据 - 如果拖的是真实文件（比如从桌面拖进页面），要用
event.dataTransfer.files而不是getData()
dragover 的 preventDefault 很容易漏掉
dragover 是唯一能“告诉浏览器：这里允许放置”的机会。它本身不带业务逻辑，但缺了它，drop 根本不会触发——哪怕你已经绑了 drop 事件。
实操建议：
立即学习“Java免费学习笔记（深入）”；
- 目标容器必须监听
dragover，且必须同步调用event.preventDefault() - 可以顺便设
event.dataTransfer.dropEffect = 'move'来改变光标样式 - 不要只靠 CSS 的
cursor: move，那只是视觉反馈，不影响实际拖放流程
移动端不支持原生 drag/drop API
所有主流 iOS 和 Android 浏览器（包括 Safari、Chrome for Android）都不支持 dragstart/drop 等事件。这不是 bug，是规范明确不强制实现的部分。
实操建议：
立即学习“Java免费学习笔记（深入）”；
- 做跨端项目时，别指望一套代码跑通 PC 和手机
- 移动端需改用
touchstart/touchmove/touchend+ 位置计算模拟拖放 - 第三方库如
interact.js或sortablejs（带 touch 支持版本）更可靠
document.querySelector('#draggable').addEventListener('dragstart', e => {
e.dataTransfer.setData('text/plain', e.target.id);
});
document.querySelector('#dropzone').addEventListener('dragover', e => {
e.preventDefault(); // 关键！
e.dataTransfer.dropEffect = 'move';
});
document.querySelector('#dropzone').addEventListener('drop', e => {
e.preventDefault(); // 关键！
const id = e.dataTransfer.getData('text/plain');
e.target.appendChild(document.getElementById(id));
});
拖放真正难的不是事件名记不住，而是每个环节都依赖上一个环节的显式许可——少一次 preventDefault，整个链条就断了。 
