热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

PHP+JS无限级可伸缩菜单详解(简单易懂)

PHP+JS无限级可伸缩菜单详解(简单易懂)
发了几天基础的东西,今天来点稍微难的,一般在CMS系统后台中都要用到的类别管理部分的精华--无限级分类菜单,对于新手来说,这个可能有一定难度,但是今天听完我细细道来,相信以后大家就都会弄这东东了。怎么实现呢?大家先做个数据库出来先:
-- 
-- 表的结构 `cr_columninfo`
-- 
代码如下:
CREATE TABLE `cr_columninfo` ( 
  `columnid` int(4) NOT NULL auto_increment, 
  `columnfatherid` int(4) NOT NULL default '0', 
  `columnname` varchar(100) NOT NULL default '', 
  `columnadder` varchar(50) NOT NULL default '', 
  `columninputdate` date NOT NULL default '0000-00-00', 
  PRIMARY KEY  (`columnid`) 
) ENGINE=MyISAM AUTO_INCREMENT=15 DEFAULT CHARSET=utf8 AUTO_INCREMENT=15 ; 
-- 导出表中的数据 `cr_columninfo`
-- 
INSERT INTO `cr_columninfo` (`columnid`, `columnfatherid`, `columnname`, `columnadder`, `columninputdate`) VALUES (1, 0, '影音明星', 'leehui', '2006-09-28'),
(2, 0, '校园风情', 'leehui1983', '2006-09-28'),
(3, 1, '港台明星', 'leehui', '2006-09-28'),
(4, 0, '风景图片', 'leehui1983', '2006-09-29'),
(5, 4, '浩瀚大海', 'leehui1983', '2006-09-29'),
(6, 5, '福州的海', 'leehui1983', '2006-09-29'),
(7, 2, '毕业图片', 'leehui', '2006-09-29'),
(9, 0, '体育明星', 'leehui1983', '2006-10-02'),
(10, 0, '精美壁纸', 'leehui1983', '2006-10-02'),
(11, 0, '城市风光', 'leehui1983', '2006-10-02'),
(12, 0, '卡通动漫', 'leehui1983', '2006-10-02'),
(13, 0, '游戏截图', 'leehui1983', '2006-10-02'),
(14, 0, '作者相册', 'leehui1983', '2006-10-02');

这些是测试数据,基本原理就是按照树型结构建立数据字段,核心就是栏目都有本身的ID号和父栏目的ID号,依靠这两个关系,建立树型结构,顶级栏目父ID=0,这个都好理解,现在来叙述下程序执行原理,本程序采用最为普遍的递归算法来遍历子菜单,首先,先查询出所有顶级菜单,显示在一个大表格里,没一行显示一个顶级菜单,再通过递归列出所有子菜单,子菜单处在上级菜单的所在行的下一行,且行的显示属性为不显示,通过程序动态生成的行ID号,结合JS控制行的显示与隐藏,也就是类似于微软菜单的可伸缩效果,文章最后有张图有助于大家理解,这是把生成页面的HTML复制进DW来只管演示程序的最终结果。
来看代码部分,并没有难懂的语法,请大家借助注释自己阅读,有兴趣可扩展此代码。
PHP代码如下: 
代码如下:
 
 
 
 
 
 
 
 
 
   
     栏目树形结构列表 
   
 
     //基本变量设置  
     $GLOBALS["ID"] =1; //用来跟踪下拉菜单的ID号  
     $layer=1; //用来跟踪当前菜单的级数  
     //连接数据库  
     $Con=mysql_connect("localhost","root","7529639");  
     mysql_select_db("cr_download");  
     mysql_query("SET NAMES 'GBK'"); 
     //提取一级菜单  
     $sql="select * from cr_columninfo where columnfatherid=0";  
     $result=mysql_query($sql,$Con);  
     //如果一级菜单存在则开始菜单的显示  
     if(mysql_num_rows($result)>0) ShowTreeMenu($Con,$result,$ID);  
     //=============================================  
     //显示树型菜单函数 ShowTreeMenu($con,$result,$layer)  
     //$con:数据库连接  
     //$result:需要显示的菜单记录集  
     //$layer:需要显示的菜单的级数  
     //=============================================  
     function ShowTreeMenu($Con,$result,$layer)  
     {  
       //取得需要显示的菜单的项目数  
       $numrows=mysql_num_rows($result);  
       //开始显示菜单,每个子菜单都用一个表格来表示  
       echo "";  
      for($rows=0;$rows<$numrows;$rows++)  
      {  
        //将当前菜单项目的内容导入数组  
        $menu=mysql_fetch_array($result);  
        //提取菜单项目的子菜单记录集  
        $sql="select * from cr_columninfo where columnfatherid=$menu[columnid]";  
        $result_sub=mysql_query($sql,$Con);  
        echo "";  
        //如果该菜单项目有子菜单,则添加Javascript onClick语句  
        if(mysql_num_rows($result_sub)>0)  
        {  
          echo " ";  
          echo "";  
        }  
        else{  
          echo " ";  
          echo "";  
        }  
     //如果该菜单项目没有子菜单,只显示菜单名称  
     echo $menu[columnname]; 
     echo "";  
     //如果该菜单项目有子菜单,则显示子菜单  
     if(mysql_num_rows($result_sub)>0)  
     {  
      //指定该子菜单的ID和style,以便和onClick语句相对应  
      echo "";  
      echo " ";  
      echo "";  
     //将级数加1  
     $layer++;  
     //递归调用ShowTreeMenu()函数,生成子菜单  
     ShowTreeMenu($Con,$result_sub,$layer);  
     //子菜单处理完成,返回到递归的上一层 
     echo "";  
     }  
     //子菜单处理完成,返回到递归的上一层,将级数减1  
     $layer--;  
   }  
     echo "";  
  }  
?> 
 

最后贴上效果图和源代码打包,希望本文对大家有所帮助^_^
下载文件 下载此文件 
推荐阅读
  • 本文介绍了在开发Android新闻App时,搭建本地服务器的步骤。通过使用XAMPP软件,可以一键式搭建起开发环境,包括Apache、MySQL、PHP、PERL。在本地服务器上新建数据库和表,并设置相应的属性。最后,给出了创建new表的SQL语句。这个教程适合初学者参考。 ... [详细]
  • 生成式对抗网络模型综述摘要生成式对抗网络模型(GAN)是基于深度学习的一种强大的生成模型,可以应用于计算机视觉、自然语言处理、半监督学习等重要领域。生成式对抗网络 ... [详细]
  • VScode格式化文档换行或不换行的设置方法
    本文介绍了在VScode中设置格式化文档换行或不换行的方法,包括使用插件和修改settings.json文件的内容。详细步骤为:找到settings.json文件,将其中的代码替换为指定的代码。 ... [详细]
  • 本文介绍了在Mac上搭建php环境后无法使用localhost连接mysql的问题,并通过将localhost替换为127.0.0.1或本机IP解决了该问题。文章解释了localhost和127.0.0.1的区别,指出了使用socket方式连接导致连接失败的原因。此外,还提供了相关链接供读者深入了解。 ... [详细]
  • 如何实现织梦DedeCms全站伪静态
    本文介绍了如何通过修改织梦DedeCms源代码来实现全站伪静态,以提高管理和SEO效果。全站伪静态可以避免重复URL的问题,同时通过使用mod_rewrite伪静态模块和.htaccess正则表达式,可以更好地适应搜索引擎的需求。文章还提到了一些相关的技术和工具,如Ubuntu、qt编程、tomcat端口、爬虫、php request根目录等。 ... [详细]
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • 本文介绍了如何使用php限制数据库插入的条数并显示每次插入数据库之间的数据数目,以及避免重复提交的方法。同时还介绍了如何限制某一个数据库用户的并发连接数,以及设置数据库的连接数和连接超时时间的方法。最后提供了一些关于浏览器在线用户数和数据库连接数量比例的参考值。 ... [详细]
  • 本文介绍了Redis的基础数据结构string的应用场景,并以面试的形式进行问答讲解,帮助读者更好地理解和应用Redis。同时,描述了一位面试者的心理状态和面试官的行为。 ... [详细]
  • 如何使用Java获取服务器硬件信息和磁盘负载率
    本文介绍了使用Java编程语言获取服务器硬件信息和磁盘负载率的方法。首先在远程服务器上搭建一个支持服务端语言的HTTP服务,并获取服务器的磁盘信息,并将结果输出。然后在本地使用JS编写一个AJAX脚本,远程请求服务端的程序,得到结果并展示给用户。其中还介绍了如何提取硬盘序列号的方法。 ... [详细]
  • 本文讨论了如何优化解决hdu 1003 java题目的动态规划方法,通过分析加法规则和最大和的性质,提出了一种优化的思路。具体方法是,当从1加到n为负时,即sum(1,n)sum(n,s),可以继续加法计算。同时,还考虑了两种特殊情况:都是负数的情况和有0的情况。最后,通过使用Scanner类来获取输入数据。 ... [详细]
  • 在说Hibernate映射前,我们先来了解下对象关系映射ORM。ORM的实现思想就是将关系数据库中表的数据映射成对象,以对象的形式展现。这样开发人员就可以把对数据库的操作转化为对 ... [详细]
  • 本文介绍了在SpringBoot中集成thymeleaf前端模版的配置步骤,包括在application.properties配置文件中添加thymeleaf的配置信息,引入thymeleaf的jar包,以及创建PageController并添加index方法。 ... [详细]
  • 知识图谱——机器大脑中的知识库
    本文介绍了知识图谱在机器大脑中的应用,以及搜索引擎在知识图谱方面的发展。以谷歌知识图谱为例,说明了知识图谱的智能化特点。通过搜索引擎用户可以获取更加智能化的答案,如搜索关键词"Marie Curie",会得到居里夫人的详细信息以及与之相关的历史人物。知识图谱的出现引起了搜索引擎行业的变革,不仅美国的微软必应,中国的百度、搜狗等搜索引擎公司也纷纷推出了自己的知识图谱。 ... [详细]
  • 本文介绍了高校天文共享平台的开发过程中的思考和规划。该平台旨在为高校学生提供天象预报、科普知识、观测活动、图片分享等功能。文章分析了项目的技术栈选择、网站前端布局、业务流程、数据库结构等方面,并总结了项目存在的问题,如前后端未分离、代码混乱等。作者表示希望通过记录和规划,能够理清思路,进一步完善该平台。 ... [详细]
  • 《数据结构》学习笔记3——串匹配算法性能评估
    本文主要讨论串匹配算法的性能评估,包括模式匹配、字符种类数量、算法复杂度等内容。通过借助C++中的头文件和库,可以实现对串的匹配操作。其中蛮力算法的复杂度为O(m*n),通过随机取出长度为m的子串作为模式P,在文本T中进行匹配,统计平均复杂度。对于成功和失败的匹配分别进行测试,分析其平均复杂度。详情请参考相关学习资源。 ... [详细]
author-avatar
mobiledu2502933045
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有