html元素
<div class="layui-form-item"> <label class="layui-form-label">选择框</label> <div class="layui-input-block"> <input type="text" id="a" class="layui-input" readonly="readonly"> </div></div>
js引用
layui.use(['form',"jquery","cascader"], function(){ var $ = layui.jquery; var cascader = layui.cascader; var data = [ { value: 'a', label: 'a', children: [ { value: 'aa1', label: 'aa1', }, { value: 'bb1', label: 'bb1' } ] }, { value: 'b', label: 'b', } ] cascader({ elem: "#a", data: data, // url: "/aa", // type: "post", // triggertype: "change", // showlastlevels: true, // where: { // a: "aaa" // }, value: ["a", "aa1"], success: function (data) { console.log(data); } });});
cascader参数说明
1、elem：input容器
2、data：需要的静态数据，类型为数组，
3、url：异步获取的数据，类型为数组，（data与url两个参数二选一）
4、type：异步获取的方式，默认get，可省略
5、where：异步传入的参数，可省略
6、triggertype：触发方式，不填或其他都为click，可选参数change，即鼠标移入触发
7、showlastlevels：输入框是否只显示最后一级,默认false，即全显示
8、value：传入的初始值，类型为数组，值为data的value值
9、success：回调函数，选择完成之后的回调函数，返回值为value数组
在线demo
github源码
相关推荐：
layui的项目优化以及无侵入优化的详细解析
layui form表单的动态渲染与vue.js之间的冲突解决方法（附代码）
以上就是基于layui如何实现无限极联选择器（附代码）的详细内容。