thinkPHP实现的联动菜单功能详解

本文实例讲述了thinkPHP实现的联动菜单功能。分享给大家供大家参考，具体如下：

联动菜单，首先给你看看前端是怎么写的：

<div id="newCat">  <div class="all_type" id="allGoogsCat">所有商品分类</div>  <div class="spfl-warp <?php if(CONTROLLER_NAME != 'Index' || ACTION_NAME != 'index'){echo 'hide';} ?> ">    <div class="index-spfl-left" id="divCatList">      <ul>        <foreach name="category_menu" key="one" item="v">        <li class="li{$one+1}">          <span><em></em>            <a href="{:U('Category/index',array('id'=>$v['category_id'],'level'=>1))}" rel="external nofollow" >{$v.category_name}</a>          </span>          <div class="div none">            <foreach name="v['childs']" key="two" item="v2">              <dl>                <dt>                  <a href="{:U('Category/index',array('id'=>$v2['category_id'],'level'=>2))}" rel="external nofollow" >{$v2.category_name}</a>                </dt>                <dd class="fl">                  <foreach name="v2['childs']" item="v3">                    <a href="{:U('Category/index',array('id'=>$v3['category_id'],'level'=>3))}" rel="external nofollow" >                      {$v3.category_name}                    </a>                  </foreach>                </dd>                <div class="cl"></div>              </dl>            </foreach>          </div>        </li>      </foreach>    </ul>  </div>  </div></div><script type="text/javascript"><?php if(CONTROLLER_NAME != 'Index' || ACTION_NAME != 'index'){ ?>  //商品分类鼠标滑过  function spflHover() {    $(".index-spfl-left ul li").live("mouseover", function () {      $(this).addClass("active").siblings().removeClass("active");      $(".index-spfl-left").find(".div").hide();      $(this).find(".div").show();    }).live("mouseout", function () {      $(this).removeClass("active");      $(".index-spfl-left").find(".div").hide();      $(this).find(".div").hide();    });    //鼠标滑过分类显示    $("#newCat").mouseover(function () {      $(".spfl-warp").show();    }).mouseout(function () {      if ($("#ismain").val() == "1") {        $(".spfl-warp").show();      } else {        $(".spfl-warp").hide();      }    })  }  spflHover();<?php } ?></script>

看到没有，其实里面的一级菜单对应二级菜单都是在同一个li里面的，li里面的二级三级呢，都是放在dl的dt和dd标签里面；

然后现在我们看看取出来的category_menu,什么样的数据：

Array( [0] => Array  (   [category_id] => 84   [category_name] => 家装主材   [parent_id] => 0   [listorder] => 200   [display] => 1   [childs] => Array    (     [0] => Array      (       [category_id] => 85       [category_name] => 厨卫       [parent_id] => 84       [listorder] => 200       [display] => 1       [childs] => Array        (         [0] => Array          (           [category_id] => 99           [category_name] => 厨盆/水槽           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [1] => Array          (           [category_id] => 98           [category_name] => 卫浴配件           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [2] => Array          (           [category_id] => 97           [category_name] => 卫浴龙头           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [3] => Array          (           [category_id] => 96           [category_name] => 龙头           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [4] => Array          (           [category_id] => 95           [category_name] => 淋浴房           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [5] => Array          (           [category_id] => 94           [category_name] => 智能坐便器           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [6] => Array          (           [category_id] => 93           [category_name] => 浴室柜           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [7] => Array          (           [category_id] => 92           [category_name] => 坐便器           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [8] => Array          (           [category_id] => 91           [category_name] => 浴霸           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [9] => Array          (           [category_id] => 90           [category_name] => 地漏           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [10] => Array          (           [category_id] => 89           [category_name] => 坐便器盖板           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [11] => Array          (           [category_id] => 88           [category_name] => 洗面盆           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [12] => Array          (           [category_id] => 87           [category_name] => 角阀           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [13] => Array          (           [category_id] => 100           [category_name] => 卫浴五金           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [14] => Array          (           [category_id] => 101           [category_name] => 厨房挂件/配件           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [15] => Array          (           [category_id] => 86           [category_name] => 淋浴花洒           [parent_id] => 85           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )        )      )     [1] => Array      (       [category_id] => 126       [category_name] => 墙纸       [parent_id] => 84       [listorder] => 200       [display] => 1       [childs] => Array        (         [0] => Array          (           [category_id] => 130           [category_name] => 3D墙纸           [parent_id] => 126           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [1] => Array          (           [category_id] => 129           [category_name] => 纯纸墙纸           [parent_id] => 126           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )         [2] => Array          (           [category_id] => 128           [category_name] => PVC墙纸           [parent_id] => 126           [listorder] => 200           [display] => 1           [childs] => Array            (            )          )