layui从后端获取数据并渲染到下拉框selected中

最新推荐文章于 2024-07-14 23:42:27 发布

My is 李豆

最新推荐文章于 2024-07-14 23:42:27 发布

阅读量1.6k

点赞数 2

文章标签： layui 前端

本文链接：https://blog.csdn.net/qq_43364241/article/details/131639318

版权

这段代码展示了如何通过JavaScript动态创建并填充一个select元素的选项。首先给select元素设置id为select-container，然后遍历一个数组，将数组中的项转化为option元素添加到select中。最后，使用layui的form模块重新渲染select以更新视图。

摘要由CSDN通过智能技术生成

话不多说上代码

// 先给 select 设置一个 id = 'select-container' 后面进行设置值使用
<select id="select-container" name="ldmc" lay-verify="required">
    <option value=""></option>
</select>



// 设置一个变量 selectHtml 用于拼接字符串，用于渲染 selected 
let selectHtml = '' ;
// 遍历数组 item: 遍历的对象 ， index 索引 ， arr 全部对象
arr.forEach(function(item,index,arr){
	// 进行拼接操作
	selectHtml = selectHtml+'<option value="'+item.ldmc+'">'+item.ldmc+'</option>' ;
});
// 将拼接好的字符串放入下拉框中
$('#select-container').append(selectHtml);
// 调用 layui的 form 对象重新渲染下拉框 
form.render('select');