重置按钮必须用 type="button"，否则会触发表单提交；级联下拉需同步清空表单值、DOM 选项和表格请求参数。
重置按钮必须用 type="button"，否则会触发表单提交
级联下拉（如“省份→城市→区县”）通常嵌在 <form> 里，如果重置按钮写成 <button>重置</button>，浏览器默认按 type="submit" 处理——哪怕没配 action，也会刷新页面或清空整个表单 dom，导致级联状态丢失、layui 渲染结构被破坏。这不是 bug，是 html 规范行为。
实操建议：
- 重置按钮务必显式声明
type="button"：<button type="button" id="resetSearch">重置</button> - 不要把重置逻辑放在
form.on('submit(filterName)')里，那是为搜索提交服务的，和重置无关 - 如果用了
layer.open弹窗承载搜索表单，也要确保弹窗内按钮不意外触发父页面表单
清空级联下拉不能只设 val('')，要配合 form.val() + form.render('select')
Layui 的 select 是 JS 动态生成的伪下拉，原生 elem.value = '' 或 $(elem).val('') 只改了隐藏的 <select> 值，UI 上的标题栏文字、选中高亮、内部状态全都不变。级联依赖的是真实值变化触发 form.on('select(xxx)')，不走这个流程，后续下拉就卡死。
实操建议：
- 对第一个级联项（如
#province）：调用form.val('searchFilter', { 'province': '' })，再form.render('select', 'searchFilter') - 对后续级联项（如
#city、#district）：同样用form.val('searchFilter', { 'city': '', 'district': '' })一并清空，再form.render('select') - 别漏掉
form.val()的第一个参数——这是你在form.render()时指定的filter名，不是随便写的字符串
table.reload() 必须传 where: {}，否则级联字段仍会带旧值发请求
很多人以为清空了下拉框 UI，表格 reload 就自然不带条件了。错。Layui 表格实例内部缓存了上次请求的 where 对象，table.reload('tableId') 不传参时，它直接复用这个缓存对象——哪怕你刚把 #province 设为空，where.province 还是上一次的值。
实操建议：
- 重置按钮点击后，必须同步执行：
table.reload('yourTableId', { where: {}, page: { curr: 1 } }) -
where: {}是唯一能清空的写法；where: null、where: undefined、甚至where: { province: '' }都不行——后者反而把空字符串当有效条件发给后端 - 级联字段名（如
province、city）要和你form.val()里传的 key 保持一致，否则where清空了，表单值却没对齐，用户再点搜索就出错
动态加载的级联选项要手动清空 <option>，否则 form.val() 无效
如果级联下拉是通过 Ajax 动态填充的（比如选完省份后请求接口填城市），那么单纯 form.val('searchFilter', { city: '' }) 并不能让下拉框回到“请选择”状态——因为 <select id="city"> 里可能只剩一个 <option value="1">北京</option>，没有空选项，UI 上就无法显示“未选中”。
实操建议：
- 在清空前，先重置
<select>的 HTML：$('#city').html('<option value="">请选择城市</option>') - 再调
form.val('searchFilter', { city: '' })和form.render('select') - 如果用了多级联动（省→市→区），建议从最深层开始清空：先清
#district的option和值，再清#city，最后清#province，避免中间某一级还残留旧选项干扰渲染
<option> 不清空，form.val() 就永远无法让 UI 显示“空”；而 table.reload() 不传 where: {}，前端清得再干净，后端收到的仍是上一轮的脏数据。 
