带有子菜单的导航菜单,使用PHP中的多维数组

时间:2015-01-05 03:23:51

标签: php arrays

您好我正在开发像wordpress这样的cms,但我有点卡在我的cms上的动态菜单上。我没有加载父菜单的问题,问题是子菜单它出于某种原因菜单上只有一个子菜单加上我的情况加上它没有加载正确的孩子

这是我的数据库结构,你们可以看看我在这里做错了什么 databaseStructure

现在我的php功能是:

      function GenerateNavHTML($nav)
{
  global $db;
  $html = '';
  $html = '<ul class="nav navbar-nav">';
  foreach($nav as $page)
  {
      $html .= '<li>';

      if ($page['isParent'] == 1  ){ $html .= '<a class="dropdown-toggle" data-toggle="dropdown">' . $page['name'] . ' <span class="caret"></span></a>';
          $html .='<ul class="dropdown-menu" role="menu">';
          $sql = "SELECT * FROM lm_menu WHERE parent = :var";
          $res = $db->prepare($sql);
          $res->bindParam("var",$page['parent'],PDO::PARAM_STR);
          $res->execute();
          $sub = $res->fetchAll(PDO::FETCH_ASSOC);
          foreach ($sub as $key) {
              if($key['parent'] == $page['name']){
                  $html .='<li><a href="#">'.$key['name'].'</a></li></ul>';
              }
          }

       }else { $html .='<a href="' . $page['ref'] . '">' . $page['name'] . '</a>'; }

      $html .= '</li>';
  }
  $html .='</ul>';
  return $html;
}

        global $db;
        $sql = "SELECT * FROM lm_menu";
        $res = $db->prepare($sql);
        $res->execute();
        $nav = $res->fetchAll(PDO::FETCH_ASSOC);


 GenerateNavHTML($nav)

我需要根据我的数据库使我的数组动态化。我试图首先寻找答案,但似乎没有与我的问题有关..

1 个答案:

答案 0 :(得分:1)

这是一个非常快速的概述。这是经过测试的代码 示例,更详细的说明和代码在此处:Example
我之前从未做过用户可配置的菜单,所以代码没有细化 它没有HTML或CSS错误。在W3C mobileOK验证器和YSlow上获得100%的分数。页面速度得分为99%(PageSpeed中的缺陷) 代码执行时间小于1毫秒。

我更喜欢表单/按钮而不是&lt; a&gt;对于按钮;用于菜单链接,因为简化了CSS。并且在不支持显示的浏览器中工作:内联块,因为BUTTON默认为内联块。

数据库表

    CREATE TABLE IF NOT EXISTS `menu` (
      `Column` int(11) NOT NULL,
      `Sort` int(11) NOT NULL,
      `MenuText` char(16) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL,
      `Destination` char(64) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL,
      `Class` int(11) NOT NULL,
      PRIMARY KEY (`Column`,`Sort`)
    ) ENGINE=MyISAM DEFAULT CHARSET=utf8;

<强> PHP

$classes=array('"top"','"sub"','"link"');
$endDiv = '';
$subs = 'var subs = [[],';
$sql = "SELECT * FROM `menu` WHERE 1 ORDER BY `Column` ASC, `Sort` ASC";
$results = mysql_query($sql);
if (mysql_errno() > 0){$error = mysql_error();echo "<p>$sql<br/>$error</p>";}

while ($row = mysql_fetch_array($results, MYSQL_NUM)) {
  $class = $classes[$row[4]];
  if ($row[4] == 1){
    echo "<div id=\"i$row[0]$row[1]\" class=$class><form action=\"$row[3]\"><div class=\"inline\"><button type=\"submit\">$row[2]</button></div></form></div>\n";
  }
  elseif ($row[4] == 2){
    echo "$endDiv<div  id=\"d$row[0]$row[1]\" class=\"col\">\n<div class=$class><form action=\"$row[3]\"><div class=\"inline\"><button type=\"submit\">$row[2]</button></div></form></div>\n";
  $endDiv="</div>\n";
  $subs .= '[],';
  }
  else{
  echo"$endDiv<div class=\"col\">\n<button type=\"button\" class=$class onclick=\"showSub($row[0])\">$row[2]</button>\n";
    $endDiv="</div>\n";
  $subs .= '[],';
  }
}
$subs = substr($subs,0,-1) . '];';
echo <<<EOT
$endDiv</div>
<script type="text/javascript">
//<![CDATA[
var divs = document.getElementsByTagName("div");
$subs
var selected = -1;
function getDivs() {
  var did = '';
  var col = 0;
  var sub = 0;
  for (var div=0; div<divs.length; div++){
    did = divs[div].getAttribute("id");
    if (did == null){continue;}
    if (did.substring(0,1) == "i"){
      col = parseInt(did.substring(1,2),10);
      subs[col].push(div);
    }
    else if (did.substring(0,1) == "d"){
      col = parseInt(did.substring(1,2),10);
    subs[col].push(0);
    }
  } 
  hideSubs();

}
function showSub(c) {
  hideSubs();
  if (selected == c){selected=-1;return;}
  selected = c;
  for (var sub=0; sub<subs[c].length; sub++){
  divs[subs[c][sub]].style.display = 'block';
  }
}
function hideSubs() {
  var sub = 0;
  var col = 0;
  var div = 1;
  var cnt = subs.length;
  while(true){
    if (div++ > cnt){break;}
    if (subs[col][0] < 1){col++;continue;}
    for (var sub=0; sub<subs[col].length; sub++){
    if (subs[col][sub] == null){continue;}
      divs[subs[col][sub]].style.display = 'none';
    }

    col++;
  }
}
window.onload = getDivs;
//]]>