代码是参考的layui的作者 贤心 的代码,其他的代码太多了,看的tree中的代码,虽然效果实现了,但是原理不是很清楚,因为涉及到闭包了,而我对于前段只知道基础的东西,对于深入的东西不是很清楚,所以,有幸看到的人,不要问我,我也不懂,嘿嘿
var dictype; $(function () { ajaxEx("/DictionaryInfo/GetDicType", {}, function (json) { if (json.Code == 0) { var data = json.Data; //dic.load(data); //加载数据 dictionary.load(data); return; } alert(json.Message); }) }) //对象 var dictionary = {}; //对象点击方法 dictionary.click = function (elem,item) { //项绑定事件 elem.children(‘a‘).on("click", function (e) { zsw.stope(e); dictype = item; LoadTable({ code: item.Code }); //alert(JSON.stringify(item)); }) } //对象加载数据方法 dictionary.load = function (json) { var dicListObj = $("#dicType"); var html = ""; if (json.length > 0) { $.each(json, function (i, item) { if (i == 0) { dictype = item; } //此句是关键,function方法闭包,不懂原理,对前端研究不深 html = $(["<li>", function () { return "<a>" + item.Name + "</a>" }(), "</li>"].join(‘‘)); dicListObj.append(html); //触发单击方法 dictionary.click(html,item); }) } dicListObj.append("<li> </li>"); } //加载表格 function LoadTable(obj) { var dicitemtable = table.render({ elem: ‘#dicItem‘ , url: ‘/DictionaryInfo/GetDicItem‘ , method: "post" , where: obj//{code:dictype.Code}//where: {token: ‘sasasas‘, id: 123} //resuest://用于修改默认的请求中页码的参数名称 , request: { pageName: ‘pageIndex‘ //页码的参数名称,默认:page , limitName: ‘pageSize‘ //每页数据量的参数名,默认:limit } //response 用于定义返回的数据格式 , response: { statusName: ‘Code‘ //数据状态的字段名称,默认:code , statusCode: 0 //成功的状态码,默认:0 , msgName: ‘Message‘ //状态信息的字段名称,默认:msg , countName: ‘TotalCount‘ //数据总数的字段名称,默认:count , dataName: ‘Data‘ //数据列表的字段名称,默认:data } , cellMinWidth: 80 //全局定义常规单元格的最小宽度,layui 2.2.1 新增 //, width: "90%"//$(window).width()- 40 , cols: [[ //{ type: ‘checkbox‘ } //开启多选框 //{ checkbox: true } { type: ‘numbers‘, title: ‘序号‘ } //, { field: ‘Id‘, width: 80, title: ‘序号‘, sort: true,style:"display:none;" }//隐藏使用display //, { field: ‘numbers‘, width: 80, title: ‘序号‘, sort: true, style: "display:none;" } //DKey,Value , { field: ‘DKey‘, width: 80, title: ‘值‘, sort: true } , { field: ‘Value‘, width: 120, title: ‘显示名称‘, sort: true } //, { field: ‘Remark‘, title: ‘说明‘, sort: true/*, templet: ‘#temp1‘ 加载模板*/ } , { align: ‘center‘, width: 180, title: ‘操作‘, toolbar: ‘#barDicItem‘ } ]] , page: false , limit: 10 , limits: [10, 30, 50, 100] , id: ‘idTest‘ }); }
原文地址:https://www.cnblogs.com/zhoushangwu/p/9191730.html
时间: 2024-10-22 08:25:07