JQuery将无限极拿到的数组展示在table表格中
php代码
//展示 public function zs(){ $this->display(); } public function zhanshi(){ $model = D("node"); $res = $model->getAll(); echo json_encode($res); }
html代码:
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <center> <table border="1"> <tr> <th>权限ID-排序ID</th> <th>权限结构</th> <th>名称</th> <th>类型</th> <th>操作</th> </tr> <tbody id="tb"></tbody> </table> </center> <script src="__PUBLIC__/js/jquery.js"></script> <script> $(document).ready(function () { //请求方法,拿到json数据 $.get("{:U('Pro/zhanshi')}",function (data) { //转化成键值格式的json var res = JSON.parse(data); //获取一下顶级菜单 var first_menu = res[0]; //获取一下二级菜单 var second_menu = first_menu.child; // console.log(second_menu); // return false; //拼接第一级的菜单 var str = ''; str += "<tr><td>"+first_menu.nid+"-"+first_menu.order_val+"</td><td>"+first_menu.chinese_name+"</td><td>"+first_menu.english_name+"</td><td>"+first_menu.type_name+"</td><td><a href='#'>删除</a></td></tr>"; //循环拼接二级菜单 for(var i=0;i<second_menu.length;i++){ str += "<tr>"; str += "<td>"+second_menu[i].nid+"-"+second_menu[i].order_val+"</td>"; str += "<td> |--"+second_menu[i].chinese_name+"</td>"; str += "<td>"+second_menu[i].english_name+"</td>"; str += "<td>"+second_menu[i].type_name+"</td>"; str += "<td><a href='#'>删除</a></td>"; str += "</tr>"; //判断一下有没有三级的菜单 if(second_menu[i].child){ var three_menu = second_menu[i].child; for(var j=0;j<three_menu.length;j++){ str += "<tr>"; str += "<td>"+three_menu[j].nid+"-"+three_menu[j].order_val+"</td>"; str += "<td> |--"+three_menu[j].chinese_name+"</td>"; str += "<td>"+three_menu[j].english_name+"</td>"; str += "<td>"+three_menu[j].type_name+"</td>"; str += "<td><a href='#'>删除</a></td>"; str += "</tr>"; } } } //替换 $("#tb").html(str); }); }); </script> </body> </html>
最终效果:
完成删除的话可以参考如下代码:
然后在这句话的外面写方法
$(document).ready(function () {
就可以了!!!!!!!!!!!!例如:
通往牛逼的路上,在意的只有远方!