带有引导菜单的多级子菜单问题

时间:2016-05-23 10:23:59

标签: php

我在php http://www.bootply.com/nZaxpxfiXz中创建动态菜单,就像这个例子一样,我得到了父菜单和子菜单但是多子级别不是
enter image description here工作,你可以从这张图片看到

这是我的代码

<?php
function curPageURL() {
 $pageURL = '';

 if ($_SERVER["SERVER_PORT"] != "80") {
  $pageURL .= $_SERVER["REQUEST_URI"];
 } else {
  $pageURL .= $_SERVER["REQUEST_URI"];
 }
 return $pageURL;
}
function ordered_list($array,$parent_id = 0)
{
  $temp_array = array();
  foreach($array as $element)
  {
    if ($element['parent_id'] == $parent_id)
    {
      $element['subs'] = $ordered_list($array, $element['id']);
      $temp_array[] = $element;
    }
  }
  return $temp_array;
}
function bootstrap_menu($array,$parent_id = 0,$parents = array())
    {
        if($parent_id==0)
        {
            foreach ($array as $element) {
                if (($element['parent_id'] != 0) && !in_array($element['parent_id'],$parents)) {
                    $parents[] = $element['parent_id'];
                }
            }
        }
        $menu_html = '';
        foreach($array as $element)
        {

            if($element['parent_id']==$parent_id)
            {
                if(in_array($element['id'],$parents))
                {


                    $menu_html .= '<li class="dropdown">';
                    $menu_html .= '<a href="'.$element['url'].'" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">'.$element['name'].' <span class="caret"></span></a>';
                }
                else   {
                 $pagenameurl=$element['url'];
                 $pagename= curPageURL();
                  $host =$_SERVER['REQUEST_URI'];
                $pages = 'boot1.php';



                if($host==$pagenameurl){  $act="active";} else { $act=""; }
                    $menu_html .= '<li class='.$act.'>';
                    $menu_html .= '<a href="' . $element['url'] . '">' . $element['name'] . '</a>';
                }
                if(in_array($element['id'],$parents))
                {
                    $menu_html .= '<ul class="dropdown-menu" role="menu">';
                    $menu_html .= bootstrap_menu($array, $element['id'], $parents);
                    $menu_html .= '</ul>';
                }
                $menu_html .= '</li>';
            }
        }
        return $menu_html;
    }
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
.marginBottom-0 {margin-bottom:0;}

.dropdown-submenu{position:relative;}
.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;}
.dropdown-submenu:hover>a:after{border-left-color:#555;}
.dropdown-submenu.pull-left{float:none;}.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}


    </style>


<style>
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover
{

}

</style>

  </head>
  <body>

        <nav class="navbar navbar-inverse navbar-static-top marginBottom-0" role="navigation">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
              <a class="navbar-brand" href="#" target="_blank">NewWindow</a>
            </div>

            <div class="collapse navbar-collapse" id="navbar-collapse-1">
                <ul class="nav navbar-nav">
               <?php

                $menu_items = array(
    array(
        "id" => "1", 
        "url" => '/boot1.php', 
        "parent_id" => "0", 
        "name" => 'Accueil', 
        "order" => "0",

    ), 
    array(
        "id" => "32", 
        "url" => '#', 
        "parent_id" =>"0", 
        "name" => 'Nos formations', 
        "order" => "10",
         "sub_level"=>"0"
    ), 
    array(
        "id" => "33", 
        "url" => 'http://www.mixcms.dev/bac-professionnel-gestion-adnimistration.html', 
        "parent_id" => "32", 
        "name" => 'Bac professionnel : GESTION ADNIMISTRATION', 
        "order" => "20",

    ), 
    array(
        "id" => 34, 
        "url" => 'http://www.mixcms.dev/bac-professionnel-arcu.html', 
        "parent_id" => 32, 
        "name" => 'Bac professionnel : ARCU', 
        "order" => "30",
         "sub_level"=>"0"
    ), 
    array(
        "id" => "35", 
        "url" => 'http://www.mixcms.dev/bac-professionnel-commerce.html', 
        "parent_id" => "32", 
        "name" => 'Bac professionnel : COMMERCE', 
        "order" => "40",

    ), 
    array(
        "id" => "36", 
        "url" => 'http://www.mixcms.dev/les-marques-partenaires.html', 
        "parent_id" => 32, 
        "name" => 'Bac professionnel : VENTE', 
        "order" => 50,
         "sub_level"=>"0"
    ), 
    array(
        "id" => "54", 
        "url" => 'http://www.mixcms.dev/bac-professionnel-option-comptabilite-et-finance-d-rsquo-entreprise.html', 
        "parent_id" => "32", 
        "name" => 'Bac professionnel : OPTION COMPTABILITÉ ET FINANCE D’ENTREPRISE', 
        "order" => "60",

    ), 
    array(
        "id" => "55", 
        "url" => 'http://www.mixcms.dev/bac-technologique-communication-et-gestion-des-ressources-humaines.html', 
        "parent_id" => "32", 
        "name" => 'Bac technologique : COMMUNICATION ET GESTION DES RESSOURCES HUMAINES', 
        "order" => "70",
         "sub_level"=>"0"
    ), 
    array(
        "id" => "39", 
        "url" => 'http://www.mixcms.dev/presentation.html', 
        "parent_id" => 0, 
        "name" => 'Présentation', 
        "order" => 80,

    ), 
    array(
        "id" => 40, 
        "url" => 'http://www.mixcms.dev/historique.html', 
        "parent_id" => "39", 
        "name" => 'Historique', 
        "order" => "90",

    ), 
    array(
        "id" => "41", 
        "url" => 'http://www.mixcms.dev/nos-atouts.html', 
        "parent_id" => "39", 
        "name" => 'Nos atouts', 
        "order" => "100",
         "sub_level"=>"0"
    ), 
    array(
        "id" => "56", 
        "url" => 'http://www.mixcms.dev/notre-projet-educatif.html', 
        "parent_id" => "39", 
        "name" => 'Notre Projet Éducatif', 
        "order" => "110",

    ), 
    array(
        "id" => "38", 
        "url" => 'http://www.mixcms.dev/inscriptions.html', 
        "parent_id" => "0", 
        "name" => 'Inscriptions', 
        "order" => "120", 

    ), 
    array(
        "id" => "57", 
        "url" => 'http://www.mixcms.dev/reglement-scolaire.html', 
        "parent_id" => "38", 
        "name" => 'Règlement scolaire', 
        "order" => "130",

    ), 
    array(
        "id" => "58", 
        "url" => 'http://www.mixcms.dev/reglement-financier.html', 
        "parent_id" => "38", 
        "name" => 'Règlement financier', 
        "order" => "140",

    ), 
    array(
        "id" => "37", 
        "url" => 'http://www.mixcms.dev/actualites.html', 
        "parent_id" => "0", 
        "name" => 'Actualités', 
        "order" => "150",

    ), 
    array(
        "id" => "42", 
        "url" => '/boot2.php', 
        "parent_id" => "0", 
        "name" => 'Contact', 
        "order" => "160",
         "sub_level"=>"0"
    ), 
    array(
        "id" => "59", 
        "url" => 'http://www.mixcms.dev/acces-pronote.html', 
        "parent_id" => "0", 
        "name" => 'Accès ProNote', 
        "order" => "170",

    )
);
              $top_menu = bootstrap_menu($menu_items);
              echo $top_menu;
              ?>






                </ul>
            </div><!-- /.navbar-collapse -->
        </nav>

        <div class="jumbotron">
            <h1 class="page-header">Bootstrap 3.0.3<br>
            <small>Navbar - Click Dropdown - Sub - Sub - Sub - Sub ...</small></h1>
        </div>

        <div class="container">

            <div class="row">
               <h1>You Like It ?</h1>
               <br>
            </div>

        </div>



  <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>
$(document).ready(function($){
    var url = window.location.href;
    $('.nav li a[href="'+url+'"]').addClass('active');
});
</script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script>


$(function(){

    var url = window.location.pathname, 
        urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); // create regexp to match current url pathname and remove trailing slash if present as it could collide with the link in navigation in case trailing slash wasn't present there
        // now grab every link from the navigation
        $('.nav li a').each(function(){
            // and test its normalized href against the url pathname regexp
            if(urlRegExp.test(this.href.replace(/\/$/,''))){
                $(this).addClass('active');
            }
        });

});
</script>



  </body>
</html>
此代码中的

sublevel参数用于多级

0 个答案:

没有答案