layui option 动态添加_layui select如何动态添加option

这次给大家带来layui select如何动态添加option，layui select动态添加option的注意事项有哪些，下面就是实战案例，一起来看一下。

html

产品类别

轻松融

容易融

快乐融

增加产品类别

js//重新渲染表单

function renderForm(){

layui.use('form', function(){

var form = layui.form();//高版本建议把括号去掉，有的低版本，需要加()

form.render();

});

}

//增加产品类别按钮点击事件

function addProductClassify(){

layer.open({

type:1,

btn:['确定','取消'],

content:$("#select_prod"),

area:['270px','160px'],

//当前层索引参数(index)、当前层的DOM对象(layero)

yes:function(index,layero){

//获取input输入的值

var ivalue=$(layero).find("input").val();

//获取要添加的option的索引

var sIndex=$("#zcySelect")[0].options.length-1;

if(ivalue==null||ivalue==''){

layer.msg("请输入产品类别")

}

else{

layer.msg("输入的产品类别是："+ivalue);

//为select添加option

$("#zcySelect").append(""+ivalue+"");

renderForm();//表单重新渲染，要不然添加完显示不出来新的option

layer.close(index);

}

$(layero).find("input").val('');

}

})

}

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：