select 标签必须设置 name 属性才能提交数据，option 应显式定义 value 避免中文或文案变更引发解析错误；multiple 时提交格式为多个同名参数或逗号分隔；required 与 disabled 不可共存，动态初始化需同步 selectedIndex 和 value。
select 标签不是“用不用”的问题，而是“怎么用对”——漏掉 name 属性，表单提交时它就等于不存在；没设 value 的 option，选中后传给后端的可能是空字符串或文本内容，极易引发解析错误。
必须带 name 才能提交数据
浏览器只把带 name 属性的表单控件值打包进请求体。如果写成 <select><option>A</option></select>，提交时这个字段压根不会出现在 FormData 或 URL 查询参数里。
-
name值要和后端约定一致，比如后端期待category，那就写<select name="category"> - 多选场景下（带
multiple），name值仍为单个字符串，但服务端需按数组或逗号分隔方式解析 - 别用
id替代name——id只用于 DOM 定位或label[for]关联
option 的 value 不写会怎样
每个 option 默认把标签内文本作为提交值。比如 <option>苹果</option> 被选中后，实际发送的是 "苹果"。这在中文环境容易出问题：
- 前后空格、全角/半角字符差异会让后端匹配失败
- 显示文案改了（如“苹果”→“红富士苹果”），但逻辑依赖旧值，直接崩
- 推荐显式写
value：<option value="apple">苹果</option>，前后端各管各的
单选 vs 多选：行为差异不止在 UI
加了 multiple 属性后，用户可按 Ctrl/Cmd 多选，但提交格式彻底改变：
立即学习“前端免费学习笔记（深入）”；
- 单选：
name=apple（URL 编码后） - 多选：
name=apple&name=banana（传统 form 提交）或name=apple,banana（某些框架自动拼接） - JavaScript 读取时，单选用
select.value，多选必须遍历select.options并检查selected状态 -
size属性只影响可见行数（如size="4"显示 4 行），不改变单/多选逻辑
required 和 disabled 别混用
两者都影响表单校验，但作用完全不同：
-
required：用户必须选一个非空option（第一个option最好设value=""并加disabled selected当占位提示） -
disabled：该控件不参与提交，也不触发change事件，且灰色不可交互 - 同时加
required和disabled会导致校验失效——浏览器直接跳过这个字段 - 想“视觉禁用但保留提交”，该用
readonly？不行，select不支持readonly，得靠 JS 拦截操作 + CSS 模拟状态
最常被忽略的其实是初始化逻辑：动态渲染 select 后，如果用 JS 设置默认选中项，别只改 option.selected = true，还得同步更新 select.selectedIndex 或 select.value，否则部分老浏览器可能不触发 change 事件。
