表单中select必须设置name属性，否则提交时后端无法接收值；value应使用语义化英文或id而非中文/空格；option需分离value（提交值）与显示文本；disabled和selected行为需严格区分，避免数据错乱或校验失效。

必须带 name 属性，否则表单提交时后端收不到值

浏览器只把带 name 的表单控件数据打包提交。select 没设 name，哪怕用户选了，请求体里也不会出现这个字段。常见错误是只写 <select></select> 就完事，忘了命名。

• name 值要语义清晰，比如 name="province"，别用 name="s1" 这类无意义名称
• 如果后端接收数组（如多选），name 本身不用加 []，浏览器自动按多次同名键发送（例如 hobby=reading&hobby=swimming）
• 同一页面多个 select 不能共用相同 name，否则值会覆盖或混乱

option 的 value 和显示文本必须分离处理

value 是提交给后端的值，textContent（标签内文字）是用户看到的内容。二者不一致很常见，也必须不一致——比如 <option value="bj">北京</option>，后端收到的是 bj，不是“北京”。

html-deploy

使用 htmlcode.fun 将 HTML 内容或文件部署到网页，适用于用户要求“部署到网页”“托管此 HTML”“生成此前端...的实时链接”等场景。

下载

• 别把中文、空格、斜杠直接塞进 value，容易引发解析问题；优先用短小英文或 ID 格式，如 value="user_1024"
• 空 value="" 是合法的，常用于占位提示项，但注意：它会被提交，后端需判断是否允许空值
• 动态生成时，确保每个 option 的 value 唯一；重复 value 会导致 JS 读取 select.value 时返回第一个匹配项，逻辑错乱

默认选中用 selected，但别多个一起加

selected 是布尔属性，写上即生效。多个 option 都加 selected，浏览器只认第一个，其余忽略——这不像 CSS 类可以叠加，是硬性规则。

• 初始默认项建议显式写 selected，别依赖“第一个就是默认”的惯性思维，尤其当选项是 JS 动态插入时
• JS 控制默认选中请用 select.value = "xxx"，比操作 selectedIndex 更可靠，避免因选项顺序变动导致选错
• 如果用 disabled + selected（比如 <option disabled selected>--请选择--</option>），该选项不会被提交，且用户无法再次选中它

禁用整个下拉框或单个选项，disabled 行为不同

select 元素加 disabled，整个控件变灰、不可点、不参与表单提交；option 加 disabled，仅该项置灰不可选，其他仍可用，且该 option 不会出现在提交数据中。

• 不要给 select 同时加 disabled 和 required——required 失效，校验跳过
• option 的 disabled 项在 iOS Safari 中仍可能被滚动穿透选中（尤其快速滑动时），属于已知渲染 bug，需额外 JS 拦截
• 禁用状态不等于只读：select 没有 readonly 属性，要用 disabled 或 CSS + JS 模拟

真实项目里最容易被跳过的，是 value 和显示文本的分离意识——很多人顺手把“北京”当 value 提交，结果后端收到中文字符串，后续做数据库关联或 API 调用时全崩。这不是样式问题，是数据契约问题。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！