最可靠方法是精准定位并移除目标option节点，如$("#mySelect option[value='5']").remove()，再调用form.render('select')更新界面；切勿操作layui生成的伪元素。
直接用 remove() 移除特定 option 节点最可靠
想删掉下拉框里某一个选项（比如 value="3" 的那个），别碰 empty() 或 html("")——它们会清空整个下拉框。正确做法是精准定位并移除目标 option 元素。
常见错误现象：调用 $("#mySelect").empty() 后所有选项都没了，但你只想删第 2 个；或者用 find("option").eq(1).remove() 却发现 layui 渲染后 DOM 结构变了，原生 option 被隐藏、实际显示的是它生成的伪元素。
- 必须操作原始
select标签下的option，不是 layui 渲染出的.layui-select-title或.layui-form-select里的内容 - 删除后要手动触发
form.render('select')，否则界面不更新 - 如果用的是
formSelects这类第三方多选插件，得走它的 API，比如formSelects.value('mySelect', [])清空，不能直接 DOM 操作
示例：删掉 value 为 "5" 的选项
$("#mySelect option[value='5']").remove();
form.render('select');
用 layui.form.on('select(...)') 配合动态数据时，删选项前先同步数据源
如果你的 select 是靠接口返回的数组动态生成的（比如 result = [{id:1,name:'A'}, {id:2,name:'B'}]），那光删 DOM 不够——下次再调用相同接口，那个选项还会回来。
使用场景：用户点击“移除该分类”按钮，你不仅要从页面上干掉这个 option，还得从本地缓存或全局数组里删掉对应项。
- 推荐把选项数据存在变量里（如
window.themeOptions = [...]），删 DOM 的同时用filter()更新该变量 - 后续重新渲染时（比如切换 tab 后再次加载），应基于更新后的变量生成
option，而不是重复请求原始接口 - 注意 value 类型：后端返回的
id是数字还是字符串？option[value=5]和option[value='5']在 jQuery 中匹配行为不同
别在 layui-form-select 的伪 DOM 上做 remove 操作
layui 会把原始 select 隐藏，然后用 div.layui-form-select 模拟下拉面板。你看到的“下拉列表”其实是它动态拼的 dl>dd，不是真实 option。直接对这些元素调 remove() 会导致状态错乱：DOM 看似没了，但原始 select 里还留着，提交表单时仍会带上值。
典型错误写法：
// ❌ 错误：操作的是 layui 生成的伪元素，原始 option 没动
$(".layui-form-select dd[lay-value='3']").remove();
正确路径永远是：改原始 select > option → 调 form.render('select') → layui 会自动重绘伪 DOM。
带 close 图标的自定义删除，本质仍是 remove + render
网上流传的“给 select 加 × 按钮”方案（比如监听 .layui-icon-close 点击），背后逻辑很简单：点击时拿到当前 select 的 ID 或 name，然后执行 $(select).find("option:selected").remove() 或清空整个值，最后 form.render()。
- close 图标是否显示，取决于
select当前是否有选中值（val()非空），和有没有禁用（prop('disabled')） - 图标点击事件里别漏掉
event.stopPropagation()，否则可能意外触发下拉展开 - 如果用了
formSelects，它的 close 是绑定在标签上的，删标签会自动同步到内部数据，不用手动操作option
真正容易被忽略的点：render 时机。很多问题不是删错了，而是删完没 render，或者 render 时传了错误的类型（比如写成 form.render('checkbox')）。只要记住——动了 select 就必须跟一句 form.render('select')，且确保它在 DOM 更新之后执行。
