Layui upload无法实现网页任意位置拖入上传，因其drag逻辑仅绑定到显式配置的elem容器，且该容器必须具备宽高、视觉样式及渲染就绪三要素；全局监听document drag事件会破坏文件队列管理，导致choose回调失效、文件信息丢失等问题。
做不到“网页任意位置拖入即上传”——layui upload 的 drag 区域必须是显式配置的 elem 容器，且该容器需满足宽高、视觉提示、渲染就绪三要素。
为什么不能全局监听 document 的 drag 事件
Layui upload 的拖拽逻辑完全依赖于 drag: true 配置后对指定 elem 元素的内部绑定（包括 dragenter、dragover、drop 等），它不会、也不应接管整个页面。强行在 document 上监听并调用 upload.submit() 会破坏文件队列管理，导致 choose 回调未执行、文件名/类型丢失、多文件只传一个等不可控问题。
drag: true 必须配合有尺寸和样式的 elem 容器
常见错误是把 elem 设为一个空 <div></div>，或仅靠 CSS 隐藏后又用 JS 显示——Layui 初始化时会读取元素的 offsetWidth 和 offsetHeight，若为 0，则拖拽逻辑直接跳过。
- 必须给 elem 设置明确宽高，例如：
style="width: 300px; height: 200px; border: 2px dashed #ccc;" - 避免父容器
overflow: hidden或子元素position: absolute导致实际可拖区域不可见 - 动态插入的容器（如弹窗、Tab 页）要等 DOM 渲染完成再调
upload.render()，可用MutationObserver或框架的生命周期钩子确认
想“看起来像全页面拖入”，得靠 CSS 视觉欺骗 + 容器覆盖
真正可行的做法是：用一个全屏遮罩层（position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9999）盖住页面，但只在用户拖入时显示，并将其作为 upload 的 elem。关键点：
- 遮罩默认
display: none，在document.addEventListener('dragenter', ...)中设为block - 遮罩内放提示文字，样式要足够醒目（字体、边框、背景半透）
- 遮罩的
drop事件触发后，立即隐藏它，避免干扰后续操作 - upload 的
elem指向这个遮罩，drag: true才生效
auto: false 时 bindAction 必须真实存在且可触发
如果设置了 auto: false（比如想统一控制上传时机），但又希望拖入即发请求，就必须确保 bindAction 对应的元素存在、没被移除、没被 display: none 隐藏——哪怕它是个 <button style="position: absolute; opacity: 0; pointer-events: none;"></button>，只要 DOM 存在且可被 JS 触发即可。
最稳妥写法是：在遮罩层里放一个不可见但合法的按钮，upload 配置中 bindAction: '#hiddenSubmitBtn'，然后在遮罩的 drop 回调里调用 $('#hiddenSubmitBtn').trigger('click')。
真正容易被忽略的是：拖拽上传的“任意位置”感知，本质是视觉和交互设计问题，不是技术开关能打开的。Layui 不提供全局 drag 支持，硬绕只会让文件状态错乱、调试成本翻倍。
