此类创建具有不同子级别的菜单:
class Bootstrap_Collapse_NavWalker extends Walker_Nav_Menu{
public function start_lvl( &$output, $depth = 0, $args = null ) {
$output .= "<ul>";
}
public function end_lvl(&$output, $depth = 0, $args = []){
$output .= "</ul>";
}
public function start_el(&$output, $item, $depth = 0, $args = [], $id = 0){
$itemClasses = empty( $item->classes ) ? array() : (array) $item->classes;
$class_names_li = "";
$class_names_a = "";
$class_names_i = "";
$item_output = "";
$hasChildrenElm = $args->walker->has_children;
if ( $hasChildrenElm ) {
$class_names_li = 'dropdown';
}
if ( $depth === 0 && !$hasChildrenElm ) {
$class_names_a = 'nav-link scrollto';
}
$activeElement = "";
if ( in_array( 'current-menu-item', $itemClasses ) ) $activeElement .'active';
$elementUrl = ! empty( $item->url ) ? esc_url($item->url) : '';
$output .= '<li class="'.$class_names_li.'">';
if ( $hasChildrenElm ) {
$output .= '<a class="'.$class_names_a.$activeElement.'" href="'.$elementUrl.'">
<span>'.$item->title.'</span>';
$class_names_i .= ($depth !== 0) ? "bi bi-chevron-right" : "bi bi-chevron-down";
$output .= '<i class="'.$class_names_i.'"></i>';
}elseif($item->title !== ""){
$output .= '<a class="'.$class_names_a.$activeElement.'" href="'.$elementUrl.'-1">'.$item->title.'</a>';
}
}
public function end_el(&$output, $item, $depth = 0, $args = []){
$output .= "</li>";
}
}
我正在等待以下 HTML:
<ul>
<li><a class="nav-link scrollto" href="#menu1">menu 1</a></li>
<li><a class="nav-link scrollto" href="#menu2">menu 2</a></li>
<li class="dropdown">
<a href="#"><span>Drop Down</span> <i class="bi bi-chevron-down"></i></a>
<ul>
<li><a href="#">Drop Down 1</a></li>
<li class="dropdown">
<a href="#"><span>Deep Drop Down</span> <i class="bi bi-chevron-right"></i></a>
<ul>
<li><a href="#">Deep Drop Down 1</a></li>
</ul>
</li>
</ul>
</li>
</ul>
但它打印这个 HTML:
<ul>
<li><a class="nav-link scrollto" href="#menu1">menu 1</a></li>
<li><a class="nav-link scrollto" href="#menu2">menu 2</a></li>
<li class="dropdown">
<a href="#dropdownLink"><span>Drop Down</span> <i class="bi bi-chevron-down"></i></a>
<ul>
<a class="" href="#dropdownLink"></a>
<li>
<a class="" href="#dropdownLink"></a>
<a href="#">Drop Down 1</a>
</li>
<li class="dropdown">
<a href="#"><span>Deep Drop Down</span> <i class="bi bi-chevron-right"></i></a>
<ul>
<a class="" href="#dropdownLink"></a>
<li>
<a class="" href="#dropdownLink"></a>
<a href="#">Deep Drop Down 1</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
正如您在每个菜单级别看到的那样,脚本再次打印父菜单的锚标记,我无法识别脚本循环何时插入父 TAG 锚,您可以帮助我解决这个问题