Select2清空选择框

### 使用 Layui 清空 Select 选择框内容 在 Layui 中，可以通过 JavaScript 或者 jQuery 来操作 DOM 实现清空 `select` 选项框的内容。对于基于 Layui 的表单组件来说，除了直接修改 HTML 结构外，还可以调用特定 API 方法来达到目的。 当需要重置或清除 select 组件已选中的值时，可以先通过移除其内部所有的 `<option>` 元素实现完全清空效果；如果只是想要取消当前的选择而保留原有的选项，则只需将 value 设置为空字符串即可[^1]。 下面是一个具体的例子展示如何使用 Layui 框架下的 JavaScript 函数来清空一个名为 `mySelect` 的下拉菜单： ```javascript // 获取到 select 对象并执行清空逻辑 document.querySelector('#mySelect').value = ''; // 将 selected 属性去掉, 只适用于简单场景 layui.form.render('select'); // 刷新渲染 select 表单项以应用更改 ``` 为了更彻底地清理掉所有选项（包括默认项），则应采用如下方式： ```html <select id="mySelect" name="city"> <!-- 这里放置 option --> </select> <button onclick="clearOptions()">Clear Options</button> <script> function clearOptions() { var selElement = document.getElementById('mySelect'); while (selElement.firstChild) { // 移除所有子节点直到没有为止 selElement.removeChild(selElement.firstChild); } layui.form.render('select'); // 更新视图状态 } </script> ``` 上述代码片段展示了两种不同的策略用于处理不同需求下的 select 控件清空操作，并且都包含了必要的刷新机制确保界面同步更新[^2]。