Detailed explanation of PHP+JS infinite scalable menu (easy to understand)_PHP tutorial

I’ve been posting basic stuff for a few days, and today I’m going to do something a little more difficult. The essence of the category management part that is generally used in the backend of a CMS system is the unlimited category menu. For novices, this may be difficult, but After listening to my detailed explanation today, I believe everyone will be able to do this stuff in the future. How to achieve it? Let’s make a database first:
--
-- Table structure `cr_columninfo`
--

Copy code Code As follows:

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;
-- Export the data in the table `cr_columninfo`
--
INSERT INTO `cr_columninfo` ( `columnid`, `columnfatherid`, `columnname`, `columnadder`, `columninputdate`) VALUES (1, 0, 'AV star', 'leehui', '2006-09-28'),
(2, 0, 'Campus Style', 'leehui1983', '2006-09-28'),
(3, 1, 'Hong Kong and Taiwan Stars', 'leehui', '2006-09-28'),
(4, 0, 'Landscape pictures', 'leehui1983', '2006-09-29'),
(5, 4, 'The vast sea', 'leehui1983', '2006-09-29'),
(6, 5, 'Fuzhou's sea', 'leehui1983', '2006-09-29'),
(7, 2, 'Graduation pictures', 'leehui', '2006-09-29' ),
(9, 0, 'Sports star', 'leehui1983', '2006-10-02'),
(10, 0, 'Exquisite wallpaper', 'leehui1983', '2006-10- 02'),
(11, 0, 'city scenery', 'leehui1983', '2006-10-02'),
(12, 0, 'cartoon animation', 'leehui1983', '2006- 10-02'),
(13, 0, 'Game screenshot', 'leehui1983', '2006-10-02'),
(14, 0, 'Author album', 'leehui1983', ' 2006-10-02');

These are test data. The basic principle is to establish data fields according to the tree structure. The core is that each column has its own ID number and the ID number of the parent column. Relying on these two Relationship, establish a tree structure, the top column parent ID = 0, this is easy to understand, now let’s describe the program execution principle. This program uses the most common recursive algorithm to traverse the submenus. First, first query all the top menus and display In a large table, each row displays a top-level menu, and then lists all submenus recursively. The submenu is located in the next row of the upper-level menu, and the display attribute of the row is not displayed. The row ID is dynamically generated by the program. No., combined with JS to control the display and hiding of rows, which is a scalable effect similar to Microsoft menus. There is a picture at the end of the article to help everyone understand. This is the final result of copying the HTML of the generated page into DW to just demonstrate the program. .
Look at the code part. There is no difficult syntax. Please read it yourself with the help of comments. If you are interested, you can expand this code.
The PHP code is as follows:

Copy the code The code is as follows:

 
 
 
 
<script>  <BR>function ShowMenu(MenuID)  <BR>{   <BR> if(MenuID.style.display=="none"){   <BR>    MenuID.style.display="";   <BR> }   <BR> else{   <BR> MenuID.style.display="none";   <BR> }   <BR>}<BR></script>



 
  🎜>
//Basic variable settings
$GLOBALS["ID"] =1; //ID number used to track drop-down menus
$layer =1; //The level used to track the current menu.
//Connect to the database.
$Con=mysql_connect("localhost","root","7529639"); ;
mysql_query("SET NAMES 'GBK'");
//Extract the first-level menu
$sql="select * from cr_columninfo where columnfatherid=0";
$result=mysql_query( $ sql,$Con);
//If the first-level menu exists, start the display of the menu
if(mysql_num_rows($result)>0) ShowTreeMenu($Con,$result,$ID);
//==============================================
//Show tree menu function ShowTreeMenu($con,$result,$layer)
//$con: database connection
//$result: menu record set to be displayed
//$layer: The level of the menu to be displayed
//====================================== =======
function ShowTreeMenu($Con,$result,$layer)
{
//Get the number of menu items that need to be displayed
$numrows=mysql_num_rows($result) ;
//Start to display the menu, each submenu is represented by a table
echo " ";
for($rows=0;$rows {
//Extract the submenu record set of menu items
$sql="select * from cr_columninfo where columnfatherid=$menu[columnid]";
$result_sub=mysql_query($sql,$Con);
echo "";
//If the menu item has a submenu, add a JavaScript onClick statement
if(mysql_num_rows($result_sub)>0)
{
echo "";
echo "";
echo "";
//If If the menu item has a submenu, the submenu will be displayed
if(mysql_num_rows($result_sub)>0)
{
//Specify the ID and style of the submenu to correspond to the onClick statement
echo "";
echo "";
}
//Submenu processing is completed, return to the previous level of recursion, and reduce the series by 1
$layer--;
} > } 
?>


Download this file



http://www.bkjia.com/PHPjc/317503.html

www.bkjia.com
true
http: //www.bkjia.com/PHPjc/317503.html

TechArticle

I’ve been posting basic stuff for a few days. Today I’m going to do something a little more difficult, which is usually used in the background of the CMS system. The essence of the category management part is reached - the unlimited category menu. For novices, this...

	;	"; } //If the menu item has no submenu, only the menu name is displayed echo $menu[columnname]; echo "
< ;/td>"; " > ShowTreeMenu($Con,$result_sub,$layer); //Submenu processing is completed, return to the previous level of recursion echo "