Heim > Web-Frontend > js-Tutorial > Hauptteil

thinkphp implementiert unbegrenzte Klassifizierung (mithilfe von Rekursion)_Javascript-Fähigkeiten

WBOY
Freigeben: 2016-05-16 15:24:35
Original
2524 Leute haben es durchsucht

Das Beispiel in diesem Artikel zeigt Ihnen den detaillierten Code von thinkphp zur Implementierung der unendlichen Klassifizierung. Ich hoffe, es wird jeden dazu inspirieren, die unendliche Klassifizierung zu lernen.

Datenbank: Test
Datentabelle: (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_', // 数据库表前缀
 'DB_CHARSET'=> 'utf8', // 字符集
 'DB_DEBUG' => TRUE, // 数据库调试模式 开启后可以记录SQL日志 3.2.3新增
),
Nach dem Login kopieren

Common/function.php Funktionsschleife durchlaufen

/*
 * 递归遍历
 * @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;
}
Nach dem Login kopieren

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();
}
Nach dem Login kopieren

Ausgabe in der Vorlage (View/Index/test.html) (unterstützt nur die Klassifizierung der Stufe 2. Wenn Sie alles anzeigen möchten, wird empfohlen, das Array zuerst in das JSON-Format zu konvertieren und dann über AJAX anzufordern und JS zu generieren )

<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>
Nach dem Login kopieren

Nachverfolgung (Ajax-Anfrage, rekursive Anzeige aller Kategorien):

Methodencontroller/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'=>'获取列表成功'));
}

Nach dem Login kopieren

Vorlagenansicht/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() {

 // 递归列表函数
 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>

Nach dem Login kopieren

Eine weitere unendliche Klassifizierung:

/**
 * 无限极分类
 * @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;
}

Nach dem Login kopieren

JS-Rekursion (speziell):

Diese Funktion entspricht der Implementierung der str_repeat-Funktion von PHP

/* 字符串重复函数 */
if(!String.str_out_times) {
 String.prototype.str_out_times = function(l) {
 return new Array(l+1).join(this);
 }
}
Nach dem Login kopieren
// 定位到当前选择
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; 
 }
 });

 // 当前是哪个分类
 selector.find('option').each(function() {
 if($(this).val() == pid) {
 $(this).attr('selected', 'selected');
 }
 });
}

Nach dem Login kopieren

Warum j=0. Da sich die Ausführungsreihenfolge anders anfühlt als bei PHP, wird sie von oben nach unten geladen. .

Ajax-Anfragedaten:

$('.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');
 });
});
Nach dem Login kopieren

Das Obige zeigt, wie thinkphp die unbegrenzte Klassifizierung implementiert. Ich hoffe, dass es für das Lernen aller hilfreich sein wird.

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage