layui select下拉框監聽值變化 layui 下拉列表的change事件

layui下拉列表的事件不能用jq的change 應該用自帶的方式寫

默認情況下，事件所監聽的是全部的form模塊元素，但如果你只想監聽某一個元素，使用事件過濾器即可。

如：<select lay-filter="test"></select>

 

監聽select

 

下拉選擇框被選中時觸發，回調函數返回一個object參數，攜帶兩個成員：

 

注意：form.render('select');渲染一下 不然你的操作還是不生效  select不是選擇器 表示渲染下拉列表 不寫表示所有表單都渲染

 

語法如下

 

 

 

1. form.on('select(filter)', function(data){
2. console.log(data.elem); //得到select原始DOM對象
3. console.log(data.value); //得到被選中的值
4. console.log(data.othis); //得到美化后的DOM對象
5. });

 

form.on('select(search_type)', function(data){
    var html_one='<option value="1">充值</option><option value="2">還本付息</option>';
    if(data.value == 1){
        $("#search_detail").html(html_one);
        form.render('select');
    }else if(data.value == 2){
        var html_two='<option value="3">提現</option><option value="4">購買產品</option>';
        $("#search_detail").html(html_two);
        form.render('select');//select是固定寫法 不是選擇器
    }

});

 

 上圖的search_type就是下拉列表的lat-filter參數的值

 lay-filter="search_type"

<div class="layui-form-item">
               <label for="type" class="layui-form-label">
                   <span class="x-red">*</span>所屬地區
               </label>
               <div class="layui-input-inline">
                   <select id="regionId" name="regionId" lay-verify="required|type" lay-filter="search_type">
                   </select>
               </div>
           </div>