手机端表单必须添加viewport元标签并遵循触控适配规范：设置padding确保44px最小高度、字号不小于16px、用原生select/date/textarea、文件上传加accept属性、按钮需加载态防重复提交、错误提示用invalid-feedback。

手机端表单必须用 viewport 元标签启动响应式

没加这行，Bootstrap 的栅格和组件在手机上会直接“失能”——比如 col-12 不占满屏、按钮缩成小点、输入框文字挤在一起。必须在 里放：

<meta name="viewport" content="width=device-width, initial-scale=1">

注意：initial-scale=1 不能省，iOS Safari 和部分安卓浏览器默认缩放会破坏表单可操作性；别写成 user-scalable=no，否则视障用户无法放大阅读。

form-control 在移动端的触控适配要点

原生 在手机上容易点不准，Bootstrap 的 form-control 类本身不解决这个问题，得靠额外控制：

• 所有输入框必须设 height 或 padding，推荐 padding: 0.5rem 0.75rem（至少 44px 高度才符合苹果人机指南）
• 禁用 font-size: smaller 或硬编码 12px，最小字号建议 16px（1rem）
• 下拉选择用 ，别用自定义美化库，原生 在 iOS/Android 上唤起的是系统级选择器，体验更稳
• 日期字段用 ，不要 JS 日历插件——移动端原生日期控件已足够，且支持无障碍读取

退款原因等长文本项必须用 textarea + form-control

用户描述问题时经常要换行、分段， 强制单行会引发误提交或漏信息。正确写法：

Temu欧洲站-退货退款

Temu 欧洲站电商退货退款API，通过 LinkFox 网关转发 Partner EU Returns & Refunds / 售后退货退款 相关后台/Temu 接口（退货申请、退款、售后单查询与处理等），接口将按 Partner 文档逐条接入。当用户提到 Temu EU 退货、退款、售后退货、return...

下载

<textarea class="form-control" rows="4" placeholder="请说明商品问题、订单号、期望处理方式..."></textarea>

注意点：

• rows="4" 是视觉行数，不是字符限制，别设 maxlength 卡死用户（后台再校验长度）
• 别用 resize: none 禁止拖拽——移动端不生效，但会干扰 PC 端调试时的排版观察
• 如果需要上传凭证图片，用 ，加 form-control 类后会自动适配为大点击区域

提交按钮必须带加载态防重复点击

手机网络不稳定，用户点一次没反应就猛点，后端可能收到多条退款申请。不能只靠 disabled 属性一禁了之：

• 点击后立刻 btn.disabled = true 并切换文字为 "提交中..."
• 成功/失败后恢复按钮状态，同时清空表单或跳转（别留着旧数据）
• 别用 button[type="submit"] 自动提交——异步请求时需手动拦截 event.preventDefault()，否则页面刷新丢失输入
• 错误提示别只写 alert()，用 Bootstrap 的 invalid-feedback 配合 is-invalid 类，贴在对应字段下方，用户不用滚动找报错位置

最常被忽略的是：退款表单里「订单号」字段通常要联动查询订单状态，这个接口响应慢时，按钮加载态必须覆盖整个操作周期，而不是只覆盖提交请求那几百毫秒。