首先看实现效果:
layui的select 若已经给了选项的数据,它还会动态生成另外一段代码:
<dl class="layui-anim layui-anim-upbit"/>
想自己添加动态的数据,则我们也需要添加:
<dl class="layui-anim layui-anim-upbit"/>
的选项数据,否则,select会失效。
$("#GoodsModifyModel_GoodsCategorySel").next().children().eq(1):可找到动态生成的dl标签,用于添加dd标签
$("#typeId").next().children().eq(1).html(html1);//layui动态生成的<dl class="layui-anim layui-anim-upbit"/>的选项数据
$("#typeId").html(html2);//自己的select选项数据
具体使用如下:
<td>资源类别</td>
<td >
<select id="typeId" name="typeId" lay-verify="required">
</select>
</td>
$(function () {
GetArticleType();
})
//获取资源类别
function GetArticleType() {
$.ajax({
url: "/admin/articleType/list",
data: {},
type: "post",
async: false,
success: function (data) {
if (data != "" && data != null) {
layui.use(['layer', 'form'], function () {
debugger
var form = layui.form;
var list = data.articleTypeList;
var length = list.length;
var html1 = '<dd lay-value="" class="layui-select-tips layui-this">请选择一个资源类别</dd>';
var html2 = '<option value="" >请选择一个资源类别</option>';
for (var i = 0; i < length; i++) {
html1 += '<dd lay-value="' + list[i].id + '">' + list[i].typeName + '</dd>';
html2 += '<option value="' + list[i].id + '">' + list[i].typeName + '</option>';
}
$("#typeId").next().children().eq(1).html(html1);
$("#typeId").html(html2);
form.render();//没有写这个,操作后没有效果
});
}
}
});
}