企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
录制的GIF动画 ![mark](http://qiniu.newthink.cc/blog/20171012-180706383.gif) >注意:这里要注意以下同几点: 1、`form.on` 的用法 2、`form.render('select');` 的用法 ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="/assets/layui/layui.js"></script> <link rel="stylesheet" href="/assets/layui/css/layui.css"> </head> <body> <form class="layui-form" action=""> <div class="layui-form-item"> <label class="layui-form-label">联动选择框</label> <div class="layui-input-inline"> <select name="province" id="province" lay-filter="provincelay"> <option value="">请选择省</option> <volist name="province" id="vo"> <option value="{$vo.id}">{$vo.name}</option> </volist> </select> </div> <div class="layui-input-inline"> <select name="city" id="city" lay-filter="citylay"> <option value="">请选择市</option> </select> </div> <div class="layui-input-inline"> <select name="distinct" id="distinct" lay-filter="distinctlay"> <option value="">请选择县/区</option> </select> </div> </div> </form> <script> layui.use(['form', 'layer'], function () { //独立版的layer无需执行这一句 var $ = layui.jquery , form = layui.form , layer = layui.layer; //独立版的layer无需执行这一句 //点击省,更换市 form.on('select(provincelay)', function (data) { console.log(data.elem); //得到select原始DOM对象 console.log(data.value); //得到被选中的值 console.log(data.othis); //得到美化后的DOM对象 var parent_id = data.value; var url = '/admin/test/getRegion/level/2/parent_id/' + parent_id; $.ajax({ type: "GET", url: url, error: function (request) { layer.msg('服务器繁忙, 请联系管理员!'); return; }, success: function (v) { v = '<option value="0">选择城市</option>' + v; $('#city').empty().html(v); console.log(v); form.render('select'); } }); }); //点击市,更换县 form.on('select(citylay)', function (data) { console.log(data.elem); //得到select原始DOM对象 console.log(data.value); //得到被选中的值 console.log(data.othis); //得到美化后的DOM对象 var parent_id = data.value; var url = '/admin/test/getRegion/level/3/parent_id/' + parent_id; $.ajax({ type: "GET", url: url, error: function (request) { layer.msg('服务器繁忙, 请联系管理员!'); return; }, success: function (v) { v = '<option value="0">选择区域</option>' + v; $('#distinct').empty().html(v); console.log(v); form.render('select'); } }); }); }); </script> </body> </html> ```