layui select重新渲染

说明文档也不知道去哪里找,记录一下

js代码:

javascript 复制代码
<script>
   layui.use(['form'], function(){
        var form = layui.form;

        // 监听select变化
        form.on('select(class_id)', function(data){
          var id=data.value; // data.value即为当前选中的值
          // 在这里编写你的代码
          //发异步,把数据提交给php
          $.ajax({
              type: "POST", //用POST方式传输       
              url: 'sel_classid', //目标地址.
              dataType: "json", //数据格式:JSON
              data: {classid : id},//传输数据
              success: function (data) {
                  if (data.code == 200) {
                      var html='<option value="0">无</option>';//需要替换的选项
                      var $ = layui.jquery;
                      $(data.list).each(function(th,val){
                          html+='<option value="'+val.id+'">'+val.card_name+'</option>';
                      })
                      $('#card_class_id').html(html);
                      form.render('select');//重新渲染
                  } else {
                      layer.msg(data.msg, {icon: -1, time: 1500, shade: 0.1});
                  }
              }
          });
        });
    });
</script>

页面代码:

html 复制代码
            <div class="layui-form-item">
                <label for="L_pass" class="layui-form-label">
                    <span class="x-red">*</span>名称
                </label>
                <div class="layui-input-inline">
                    <select name='card_class_id' id='card_class_id' lay-filter="card_class_id">
                        <option value='0'>无</option>
                    </select>
                </div>
            </div>

重点:

1.select 标签里 lay-filter 属性

2.form.render('select');//重新渲染

3.其他就和正常操作DOM一样

4.var $ = layui.jquery;//这样和操作jQuery 一样

相关推荐
专业抄代码选手8 分钟前
06|双缓冲与 Commit:让 Fiber 支持第二次渲染
前端·javascript·react.js
涛涛ing8 分钟前
4.8K Star!一套规则让 AI 帮你写出“像人写的”前端代码
前端
万物智能11 分钟前
OpenHarmony源码树解剖—【万物智能之开源鸿蒙OpenHarmony系统实战开发系列教程】
前端·后端
天才熊猫君14 分钟前
通用虚拟滚动表格行拖拽排序:从思路到完整实现
前端·javascript
hh95016 分钟前
Agent Plan × DeepSeek Harness:角色 Prompt 驱动的 Agent 分工优化与协作质量实验
java·前端·人工智能·prompt·adg·agent plan·adg成都社区
专业抄代码选手19 分钟前
05|把递归渲染拆成 Fiber:让一棵大树可以暂停
前端·javascript·react.js
像我这样帅的人丶你还22 分钟前
🚀苹果的液态玻璃咋做?🚀
前端·webgl·three.js
天才熊猫君25 分钟前
Vue 3 插槽机制深度解析:两条线与三层树
前端·javascript
爱丶不疚28 分钟前
BrowserWindow:你的Electron 应用可以不用手写红绿灯
前端·electron
用户5944041035635 分钟前
【完整fx】Vue3 + TS + Leafletjs 打造企业级原神大地图
前端