首页 > 解决方案 > 响应式多级动态菜单php mysql

问题描述

我使用 mysql php 制作了动态菜单。在桌面上一切正常。但问题是它为每个 ul 添加了下拉菜单类,因此子菜单将变得不可点击,因为它尝试打开其他子菜单,因为下拉类。这是我的代码。请在移动版和桌面版上检查它。

数据库表:

CREATE TABLE `tbl_menu` (
`id` int(10) UNSIGNED NOT NULL,
`label` varchar(200) NOT NULL DEFAULT '',
`link` varchar(100) NOT NULL DEFAULT '',
`parent` int(10) UNSIGNED NOT NULL DEFAULT '0',
`sort` int(10) UNSIGNED NOT NULL DEFAULT '0'
) ENGINE=InnoDB DEFAULT CHARSET=latin1;


INSERT INTO `tbl_menu` (`id`, `label`, `link`, `parent`, `sort`) VALUES
(1, 'Home', 'index.php', 0, 1),
(2, 'Offer Store', '#', 0, 2),
(3, 'Adidas', 'coupon_brand_store.php?id=20&page=1', 2, 3),
(4, 'Deal Store', '#', 0, 7),
(5, 'Nike', 'deal_brand_store.php?id=20&page=1', 4, 8),
(6, 'Mcd', 'coupon_brand_store.php?id=22&page=1', 2, 4),
(7, 'ON', 'coupon_brand_store.php?id=19&page=1', 2, 5),
(8, 'Walmart', 'coupon_brand_store.php?id=25&page=1', 2, 6),
(9, 'Tacos', 'deal_brand_store.php?id=21&page=1', 4, 9),
(10, 'Herblife', 'deal_brand_store.php?id=22&page=1', 4, 10),
(11, 'GAS', 'deal_brand_store.php?id=19&page=1', 4, 11),
(12, 'Offers Store', '#', 0, 12),
(13, 'PUMA', 'ecommerce.php?id=19&page=1', 12, 13),
(14, 'REEBOK', 'ecommerce.php?id=20&page=1', 12, 14),
(15, 'All Stores', 'allstores.php', 0, 15),
(17, 'All Coupons', 'coupons.php', 0, 16),
(18, 'All Deals', 'exclusive.php', 0, 17); 

这是打印导航菜单的 PHP 代码:

function get_menu_tree($parent_id) 
{
global $con;
$menu = "";
$sqlquery = " SELECT * FROM tbl_menu where parent='" .$parent_id . "' order 
by sort";
$res=mysqli_query($con,$sqlquery);
while($row=mysqli_fetch_array($res,MYSQLI_ASSOC)) 
{
       $menu .="<li ><a href='".$row['link']."'>".$row['label']."</a>";

       $menu .= "<ul class='dropdown-menu'>".get_menu_tree($row['id'])." 
</ul>"; //call  recursively

       $menu .= "</li>";

}

return $menu;
} 

?>
<div id="main-menu" class="wa-main-menu main-menu">
<!-- Menu -->
<div class="wathemes-menu relative">
<!-- navbar -->
<div class="navbar navbar-default theme-bg mar0" role="navigation">
<div class="container">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="navbar-header">
<!-- Button For Responsive toggle -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data- 
target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>

</div>
<!-- Navbar Collapse -->
<div class="navbar-collapse collapse">
<div class="row">
<ul class="nav navbar-nav">
<?php echo get_menu_tree(0);//start from root menus having parent id 0 ?>
</ul> 
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

如果我从 ul 中删除下拉类,下拉菜单将停止工作。

标签: phphtmlcss

解决方案


推荐阅读