最可靠做法是将透明file input绝对定位覆盖单元格，监听其change事件而非click；需确保ios下input.click()在用户手势同步调用，并校验文件类型大小后清空input值以防change不触发。
用 <input type="file"> 覆盖单元格实现点击上传
HTML 表格本身不支持直接点击单元格触发文件选择，必须借助 <input type="file">。最可靠的做法是把 file input 叠在单元格上，视觉隐藏但保留交互能力。
关键不是“给 <td> 加事件”，而是让 file input 占满单元格、透明化、不遮挡文字（用 <code>pointer-events: none 配合层级控制）：
<td> 设为 <code>position: relative-
<input type="file">绝对定位，top: 0; left: 0; width: 100%; height: 100% - 设
opacity: 0或visibility: hidden，但不能用display: none（会禁用交互） - 为避免遮挡单元格内文字，可加
pointer-events: none到 input，再给文字容器加pointer-events: auto - 必须监听 input 的
change事件，而不是 td 的 click -
event.target.files是FileList，至少要检查length > 0才继续 - 若需多文件，记得加
multiple属性；否则每次只取第一个 - 不要直接用
form.submit()，现代做法是用FormData+fetch - 绑定到
<td> 的 <code>onclick里调input.click()是安全的 - 但写成
td.addEventListener('click', () => setTimeout(() => input.click(), 0))就会失效 - 更稳妥的方式：把 input 放在 td 内部，用
label包裹（for指向 input id），label 点击天然触发 file input，兼容性更好 - 限制图片上传？检查
file.type.startsWith('image/')+file.size - 限制 Excel？比对
file.name.endsWith('.xlsx')或file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' - 注意：Safari 对某些 MIME 类型识别不一致，建议结合后缀名兜底
- 校验失败后记得
input.value = ''，否则同个文件重复选不会再次触发change
change 事件里读取文件，别依赖 click
file input 不会像按钮那样“点击即触发上传”，它只在用户选完文件后触发 change 事件。监听错事件（比如只绑 click）会导致逻辑断掉。
常见错误：在 td 上绑 click 然后手动调 input.click()，这虽能唤起选择框，但后续没监听 change 就拿不到文件。
移动端 Safari 对 click() 调用有限制
iOS Safari 不允许 JS 在非用户手势上下文中调用 input.click() —— 比如在异步回调、定时器或网络响应后触发，会静默失败。
所以“点击单元格 → 触发 input.click() → 弹出选择框”这个链路，在 iOS 上必须确保 click() 是用户点击事件处理函数的**直接同步调用**。
上传前校验文件类型和大小得在前端做
服务端校验是必须的，但前端拦截大文件或错误类型能立刻反馈，避免无效请求。
input.files[0] 有 size（字节）和 type（MIME，注意可能为空），但不能仅靠 type 判断真实类型（浏览器不校验扩展名）。
文件上传不是“点一下就完事”，真正卡住人的往往是 iOS 兼容性、事件时机、以及没清空 input 导致 change 不触发——这些点漏一个，功能就看似“点了没反应”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
