thinkphp實(shí)現(xiàn)無限分類(使用遞歸)
本文實(shí)例為大家分享了thinkphp實(shí)現(xiàn)無限分類的詳細(xì)代碼,希望對大家學(xué)習(xí)無限分類有所啟發(fā)。
數(shù)據(jù)庫: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ù)庫表前綴 'DB_CHARSET'=> 'utf8', // 字符集 'DB_DEBUG' => TRUE, // 數(shù)據(jù)庫調(diào)試模式 開啟后可以記錄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級分類,如果想全部顯示,建議先把數(shù)組轉(zhuǎn)換成JSON格式,然后通過AJAX請求,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請求,遞歸顯示所有分類):

方法 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>分類測試</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請求 用$.post() 會更方便
$.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>
另一種無限級分類:

/**
* 無限極分類
* @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遞歸(特殊):

這個函數(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)前是哪個分類
selector.find('option').each(function() {
if($(this).val() == pid) {
$(this).attr('selected', 'selected');
}
});
}
為什么j=0呢。因?yàn)閳?zhí)行順序感覺與php不同,這里是從上到下加載。。
ajax請求數(shù)據(jù):
$('.btn-edit').click(function() {
var id = $(this).data('id');
$.post("{:U('Article/editArticle')}", {id: id}, function(res) {
// 分類
$('[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)無限分類的方法,希望對大家的學(xué)習(xí)有所幫助。
- thinkphp5實(shí)現(xiàn)無限級分類
- 使用ThinkPHP的自動完成實(shí)現(xiàn)無限級分類實(shí)例詳解
- Thinkphp無限級分類代碼
- ThinkPHP無限級分類原理實(shí)現(xiàn)留言與回復(fù)功能實(shí)例
- ThinkPHP自動填充實(shí)現(xiàn)無限級分類的方法
- thinkphp框架無限級欄目的排序功能實(shí)現(xiàn)方法示例
- thinkPHP實(shí)現(xiàn)遞歸循環(huán)欄目并按照樹形結(jié)構(gòu)無限極輸出的方法
- ThinkPHP實(shí)現(xiàn)遞歸無級分類——代碼少
- Thinkphp框架使用list_to_tree 實(shí)現(xiàn)無限級分類列出所有節(jié)點(diǎn)示例
相關(guān)文章
詳解webpack和webpack-simple中如何引入css文件
這篇文章主要介紹了詳解webpack和webpack-simple中如何引入css文件,非常具有實(shí)用價值,需要的朋友可以參考下2017-06-06
用 JavaScript 給站外鏈接的 cursor 進(jìn)行改造
用 JavaScript 給站外鏈接的 cursor 進(jìn)行改造...2006-12-12
web網(wǎng)頁按比例顯示圖片實(shí)現(xiàn)原理及js代碼
由于上傳圖片的大小是未知的,在顯示成縮略圖的時候必須進(jìn)行按比例的縮放才能美觀地顯示,本文將為大家簡單的介紹一種比較不錯的方法,有此需求的朋友可以參考下2013-08-08
js判斷樣式className同時增加class或刪除class
用正則表達(dá)式判斷多個class之間是否存在真正的class(前后空格的處理)然后增加class刪除class,本文給予實(shí)現(xiàn)方法,感興趣的朋友可以了解下,或許對你有所幫助2013-01-01
詳解CocosCreator項(xiàng)目結(jié)構(gòu)機(jī)制
這篇文章主要介紹了詳解CocosCreator項(xiàng)目結(jié)構(gòu)機(jī)制,只有了解這些機(jī)制后,才能更好的進(jìn)行項(xiàng)目開發(fā),避免潛在錯誤,并且快速的除錯2021-04-04
一個JavaScript獲取元素當(dāng)前高度的實(shí)例
這篇文章主要為大家介紹了一個JavaScript獲取元素當(dāng)前高度的實(shí)例,比較實(shí)用,建議新手朋友們可以看看2014-10-10

