jQuery菜单没有加载PHP子类别

Question

我们有一个自定义的jQuery菜单,它在我们的OpenCart商店中运行良好.但是,不会显示第二级子类别,更改或原始菜单上的PHP不正确.任何具有2个或更多深度的类别都不会显示.

所以我们在http://ocart.site/opencart/index.php?route=product/category&path=25_29_59上有一个2深类别

但是你看到它不会显示在http://ocart.site/opencart的主菜单中

如果我在原始默认菜单的默认部分中添加,它实际上会使菜单中断.您可以在http://ocart.site/defaultmenutoJQ.html上查看旧菜单和新菜单的比较

有什么东西阻碍了显示器的负载,有什么想法可能是什么？

这是JSFiddle的所有相关代码https://jsfiddle.net/mtq5khz0/

  <?php if ($categories) { ?>
  <div id="cssmenu">
    <ul>
      <?php foreach ($categories as $category) { ?>
      <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a>
          <?php for ($i = 0; $i < count($category['children']);) { ?>
          <ul>
            <?php $j = $i + ceil(count($category['children']) / $category['column']); ?>
            <?php for (; $i < $j; $i++) { ?>
            <?php if (isset($category['children'][$i])) { ?>
            <li><a href="<?php echo $category['children'][$i]['href']; ?>"><?php echo $category['children'][$i]['name']; ?></a></li>
            <?php } ?>
            <?php } ?>
          </ul>
          <?php } ?>
        <?php } ?>
      </li>
    </ul>
  </div>
  <?php } ?>

OpenCart的整个标题代码 - 编辑代码https://jsfiddle.net/v5vmLbjj/

OpenCart默认安装的整个标头代码https://jsfiddle.net/tneqy2qt/

(类别下拉菜单代码,靠近代码块的页脚)

这是PHP使用的JQuery菜单代码https://jsfiddle.net/ezhnnbsg/

Answer 1

如果我理解正确的话，通过查看您的代码，有几件事对我来说很突出。

首先，您仅循环遍历$categoriesand every $category['children']。要到达“第二级”子级，您需要执行另一个循环。例如：

if(!empty($category['children'][$i]['children'])) {
    echo '<ul>'; 
    foreach($category['children'][$i]['children'] as $children2) {
        echo '<li/>';
    }
    echo '</ul>'; 
}

我看到的第二个问题是你的小提琴CSS。

你有这个：

#cssmenu ul ul li a { font-size: 12px; font-weight: 400; z-index: 9999; width: 250px; padding: 11px 15px; text-decoration: none; color: #000; border-bottom: 1px solid rgba(150, 150, 150, .15); background: #ddd; webkit-font-size: 11.5px; }

和

#cssmenu .submenu-button { position: absolute; z-index: 99; top: 0; right: 0; display: block; width: 46px; height: 32px; cursor: pointer; border-left: 1px solid rgba(120, 120, 120, .2); }

#cssmenu .submenu-button是触发下拉菜单的类，因此它需要上面的 z-index#cssmenu ul ul li a

所以改成这样：

#cssmenu ul ul li a { font-size: 12px; font-weight: 400; z-index: 98; width: 250px; padding: 11px 15px; text-decoration: none; color: #000; border-bottom: 1px solid rgba(150, 150, 150, .15); background: #ddd; webkit-font-size: 11.5px; }

注意z-index: 98;而不是z-index: 9999;？

希望这有助于解决您的问题。