thinkphp實(shí)現(xiàn)無(wú)限分類(lèi)(使用遞歸)
本文實(shí)例為大家分享了thinkphp實(shí)現(xiàn)無(wú)限分類(lèi)的詳細(xì)代碼,希望對(duì)大家學(xué)習(xí)無(wú)限分類(lèi)有所啟發(fā)。
數(shù)據(jù)庫(kù):test
數(shù)據(jù)表:(tp_category):
Common/conf/config.php
'DB_CONFIG2' => array( 'db_type' => 'mysql', 'db_user' => 'root', 'db_pwd' => '', 'db_host' => 'localhost', 'db_port' => '3306', 'db_name' => 'test', 'DB_PREFIX' => 'tp_', // 數(shù)據(jù)庫(kù)表前綴 'DB_CHARSET'=> 'utf8', // 字符集 'DB_DEBUG' => TRUE, // 數(shù)據(jù)庫(kù)調(diào)試模式 開(kāi)啟后可以記錄SQL日志 3.2.3新增 ),
Common/function.php 遍歷函數(shù)loop
/* * 遞歸遍歷 * @param $data array * @param $id int * return array * */ function recursion($data, $id=0) { $list = array(); foreach($data as $v) { if($v['pid'] == $id) { $v['son'] = recursion($data, $v['id']); if(empty($v['son'])) { unset($v['son']); } array_push($list, $v); } } return $list; }
Controller/IndexController.class.php
public function test() { $category = M('category', '', C('DB_CONFIG2'))->select(); $result = loop($category); var_dump($result); $this->assign('list', $result); $this->display(); }
在模板(View/Index/test.html)中輸出(僅支持2級(jí)分類(lèi),如果想全部顯示,建議先把數(shù)組轉(zhuǎn)換成JSON格式,然后通過(guò)AJAX請(qǐng)求,JS生成)
<ul> <volist name="list" id="vo"> <li> {$vo.category} <notempty name="vo['children']"> <ul> <volist name="vo['children']" id="cate"> <li>{$cate.category}</li> </volist> </ul> </notempty> </li> </volist> </ul>
后續(xù)(ajax請(qǐng)求,遞歸顯示所有分類(lèi)):
方法 Controller/IndexController.class.php
public function test() { $this->display(); } public function resultCategory() { $category = M('category', '', C('DB_CONFIG2'))->select(); $result = loop($category); $this->ajaxReturn(array('data'=>$result,'status'=>'1','info'=>'獲取列表成功')); }
模板View/Index/test.html
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>分類(lèi)測(cè)試</title> <script src="__PUBLIC__/js/jquery.min.js"></script> </head> <body> <ul id="menu"></ul> <script> $(function() { // 遞歸列表函數(shù) function recursion(selector,data) { if(!data) return false; for(var i=0;i<data.length;i++) { var li=$('<li>'+data[i]['category']+'</li>'); if(data[i]['children'] && data[i]['children'].length>0) { var ul=$('<ul></ul>'); recursion(ul,data[i]['children']); li.append(ul); } selector.append(li); } } // ajax請(qǐng)求 用$.post() 會(huì)更方便 $.ajax({ url: "{:U('resultCategory')}", type: 'post', dataType: 'json', error: function(res) { console.log(res); }, success: function(res) { recursion($('#menu'),res['data']); console.log(res['data']); } }); }); </script> </body> </html>
另一種無(wú)限級(jí)分類(lèi):
/** * 無(wú)限極分類(lèi) * @param [type] $cate [description] * @param integer $pid [description] * @param integer $level [description] * @param string $html [description] * @return [type] [description] */ function sortOut($cate,$pid=0,$level=0,$html='--'){ $tree = array(); foreach($cate as $v){ if($v['pid'] == $pid){ $v['level'] = $level + 1; $v['html'] = str_repeat($html, $level); $tree[] = $v; $tree = array_merge($tree, sortOut($cate,$v['id'],$level+1,$html)); } } return $tree; }
JS遞歸(特殊):
這個(gè)函數(shù)相當(dāng)于實(shí)現(xiàn)php的str_repeat函數(shù)
/* 字符串重復(fù)函數(shù) */ if(!String.str_out_times) { String.prototype.str_out_times = function(l) { return new Array(l+1).join(this); } }
// 定位到當(dāng)前選擇 function recursion(selector, data, j, pid) { var space = ' ┠ '; if(!data) return false; $.each(data, function(i, item) { var opt = $('<option value="'+item.id+'">'+space.str_out_times(j)+item.name+'</option>');selector.append(opt); if(item.son && (item.son).length>0) { recursion(selector, item.son, ++j); j=0; } }); // 當(dāng)前是哪個(gè)分類(lèi) selector.find('option').each(function() { if($(this).val() == pid) { $(this).attr('selected', 'selected'); } }); }
為什么j=0呢。因?yàn)閳?zhí)行順序感覺(jué)與php不同,這里是從上到下加載。。
ajax請(qǐng)求數(shù)據(jù):
$('.btn-edit').click(function() { var id = $(this).data('id'); $.post("{:U('Article/editArticle')}", {id: id}, function(res) { // 分類(lèi) $('[name="pid"]').html(''); recursion($('[name="pid"]'), res.sort, 0, res.pid); $('[name="id"]').val(res.id); $('[name="title"]').val(res.title); $('[name="summary"]').val(res.summary); $('#thumbnailImg').attr('src', "__UPLOAD__"+'/thumbnail/'+res.thumbnail); ue.setContent(res.content); $('#modal-edit').modal('show'); }); });
以上就是thinkphp實(shí)現(xiàn)無(wú)限分類(lèi)的方法,希望對(duì)大家的學(xué)習(xí)有所幫助。
- thinkphp5實(shí)現(xiàn)無(wú)限級(jí)分類(lèi)
- 使用ThinkPHP的自動(dòng)完成實(shí)現(xiàn)無(wú)限級(jí)分類(lèi)實(shí)例詳解
- Thinkphp無(wú)限級(jí)分類(lèi)代碼
- ThinkPHP無(wú)限級(jí)分類(lèi)原理實(shí)現(xiàn)留言與回復(fù)功能實(shí)例
- ThinkPHP自動(dòng)填充實(shí)現(xiàn)無(wú)限級(jí)分類(lèi)的方法
- thinkphp框架無(wú)限級(jí)欄目的排序功能實(shí)現(xiàn)方法示例
- thinkPHP實(shí)現(xiàn)遞歸循環(huán)欄目并按照樹(shù)形結(jié)構(gòu)無(wú)限極輸出的方法
- ThinkPHP實(shí)現(xiàn)遞歸無(wú)級(jí)分類(lèi)——代碼少
- Thinkphp框架使用list_to_tree 實(shí)現(xiàn)無(wú)限級(jí)分類(lèi)列出所有節(jié)點(diǎn)示例
相關(guān)文章
微信小程序關(guān)鍵字變色實(shí)現(xiàn)代碼實(shí)例
這篇文章主要介紹了微信小程序關(guān)鍵字變色實(shí)現(xiàn)代碼實(shí)例,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-12-12用javascript實(shí)現(xiàn)源代碼的隱藏與解密的方法
用javascript實(shí)現(xiàn)源代碼的隱藏與解密的方法2009-12-12javascript同頁(yè)面多次調(diào)用彈出層具體實(shí)例代碼
一個(gè)在同一個(gè)頁(yè)面可多次調(diào)用的javascript彈出層效果,有需要的同學(xué)可以參考一下2013-08-08js將long日期格式轉(zhuǎn)換為標(biāo)準(zhǔn)日期格式實(shí)現(xiàn)思路
本文為大家詳細(xì)介紹下js將long日期格式轉(zhuǎn)換為標(biāo)準(zhǔn)日期格式,感興趣的朋友可以參考下哈,希望可以幫助到你2013-04-04javascript 發(fā)布-訂閱模式 實(shí)例詳解
這篇文章主要介紹了javascript 發(fā)布-訂閱模式,結(jié)合實(shí)例形式詳細(xì)分析了javascript發(fā)布-訂閱模式基本功能、原理、實(shí)現(xiàn)方法與相關(guān)使用技巧,需要的朋友可以參考下2023-06-06js+css實(shí)現(xiàn)增加表單可用性之提示文字
平常設(shè)計(jì)表單的時(shí)候,我們會(huì)加入一些提示文字,最常見(jiàn)的做法是利用value來(lái)設(shè)置,下面與大家分享一個(gè)實(shí)例,感興趣的朋友可以參考下哈2013-06-06