前台页面:
<select name="xm" id="xm" lay-verify="required" lay-filter="xmFilter">
<option value=""></option>
</select>
前台js:
<script>
layui.use(['form', 'upload', 'layer'], function () {
var form = layui.form;
//检查项目添加到下拉框中
$.ajax({
url: '../hwjg_App/hwjgApp_ashx/GetXm.ashx',
dataType: 'json',
type: 'get',
success: function (data) {
$.each(data, function (index, item) {
$('#xm').append(new Option(item.xm, item.id));// 下拉菜单里添加元素
});
layui.form.render("select");
//重新渲染 固定写法
}
})
});
})
</script>
再补充两点:
1.假如你的下拉框在绑定了数据之后出现数据,但是样式丢失的话
第一个方面你要看是否忘记了form.render();
假如你已经重新渲染了还是没有样式 你可以在外层加一个<form class="layui-form"></form>
2.弹层中的下拉框通常会只出现一半 另一半被遮住从而使弹层页面出现一个纵向滚动条 解决办法,添加css:
.layui-layer-page .layui-layer-content {
overflow: visible !important;
}
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?