layui下拉框的使用

本文介绍了在HTML中设置固定值的option元素的重要性,特别是在使用layui框架时,value值的缺失可能导致下拉框默认选中项始终为第一项。通过示例代码展示了如何在静态HTML中设置option值,以及在JavaScript中动态插入option并进行渲染。同时提供了监听下拉框选择事件的方法,以便于获取选中项的数据。
摘要由CSDN通过智能技术生成

在HTML中写固定值

option的value值一定要给,不然选中一个,再次展开下拉框时,默认选中项一直是第一项

<div class="layui-form" lay-filter="myDiv">
   <select name="" id="" lay-filter="mySelect">
      <option value="zhang">张先生</option>
      <option value="wang">王先生</option>
      <option value="li">李先生</option>
   </select>
</div>

   
   
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

如果没有渲染,就在js里写上

layui.form.render('select','myDiv');

   
   
  • 1

js动态插入option 渲染下拉框

var str = '<option value="zhang">张先生</option><option value="wang">王先生</option><option value="li">李先生</option>';
$('select').append(str);
layui.form.render('select','myDiv');

   
   
  • 1
  • 2
  • 3

下拉框选择某一项

layui.form.on('select(mySelect)', function (data) {
    console.log(data);
})

   
   
  • 1
  • 2
  • 3
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值