如何在我的侧边栏中悬停时进行动态下拉？

Question

当我单击按钮时，侧边栏将带有动态类别。当我将鼠标悬停在一个类别上时，我试图在侧栏中显示子类别。但是我很难找到这个，因为我是新人。我的代码是 <style>   .sidenav1 {  height: auto;  width: 0;  position: fixed;  z-index: 1;  top: 0;  left: 0;  background-color: #26b14f;  overflow-x: hidden;  padding-top: 60px;}.sidenav1 a {  padding: 8px 8px 8px 32px;  text-decoration: none;  font-size: 18px;  color: #fff;  display: block;  transition: 0.3s;}.sidenav1 a:hover {  color: #e0dbdb;}.sidenav1 .closebtn {  position: absolute;  top: 0;  right: 25px;  font-size: 36px;  margin-left: 50px;}</style><div class="control-group" style="margin-top: 0px;">            <div id="mySidenav" class="sidenav1">                <a href="javascript:void(0)" class="closebtn" onclick="closeNav1()">&times;</a>                        <?php $sql=mysqli_query($con,"select id,categoryName  from category");                        while($row=mysqli_fetch_array($sql))                        {                        ?>                        <a href="category.php?cid=<?php echo $row['id'];?>" >|                        <?php echo $row['categoryName'];?></a>                        <?php }                        ?>            </div>        <span id="open" style="font-size:30px;cursor:pointer;color: #ffffff;margin-left: 10px;" title= "categories" onclick="openNav1()">&#9776; </span>        </div><script>function openNav1() {  document.getElementById("mySidenav").style.width = "275px";}function closeNav1() {  document.getElementById("mySidenav").style.width = "0";}</script>当我将鼠标悬停在类别上时，应该会出现相应的子类别。我的数据库就像，有两个表一个类别表和另一个子类别表。类别表id  categoryName1   aaa2   bbb3   ccc子类别表id categoryid subcategory_name1      1           zzz2      2           yyy3      2           xxx4      3           www

Answer 1

你需要创建一个多维数组来实现你想要的。由于您是初学者，因此最好走一条更简单的道路（尽管这不是最佳方式，但您会明白我为什么这么说）。

$sql=mysqli_query($con,"select id,categoryName  from category");

$catSubCatArr = array();

while($row=mysqli_fetch_array($sql)){

    $catSubCatArr[$row['id']] = $row['categoryName'];

    $innerSql=mysqli_query($con,"select id, categoryid, subcategory_name from subcategory where categoryid = ".$row['id']]);

    while($innerRow=mysqli_fetch_array($innerSql)){

        $catSubCatArr[$row['id']]['subcategory'][$innerRow['id']] = $innerRow['subcategory_name'];

    }

}

现在在foreach()的帮助下创建您想要的下拉列表，该下拉列表将与此 $catSubCatArr 嵌套。我想再次通知您，在循环中调用 SQL 查询绝不是一个好主意，它会减慢进程。但我认为这会有所帮助，当您完全了解流程时，您可以进行更改。

你可以像这样添加 HTML

<?php foreach($catSubCatArr as $key=>$val){ ?>

<a href="category.php?cid=<?php echo $key;?>" >|

<?php echo $val['categoryName'];?></a>

<?php /* Here start your sub category html?>

<?php foreach($val['subcategory'] as $innerkey=>$innerval){?>

<a href="category.php?cid=<?php echo $innerkey;?>" >|

<?php echo $innerval['subcategory_name'];?></a>

<?php }

}?>