下拉引导菜单未在网页上填充

时间:2014-02-05 22:14:02

标签: php jquery html css twitter-bootstrap

我有一个头文件,我试图在其中包含一个引导下拉列表,该下拉列表将包含用户ID以及下拉列表中的另外两个选项。在头文件中,我创建了一个用于下拉列表的新div,并将其链接到一个php文件,其中我有用于填充下拉列表的用户ID信息的逻辑。

的header.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <!--<style>{height:150px; width:1300px;}</style>-->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="Public">
    <title><?php echo $page_title?></title>
    <script src="js/bootstrap.js"</script>
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.min.js"></script>
    <script src="script_dbafactory.js?<?php echo rand(0,511);?>"></script>
    <link href="css/bootstrap.css" rel="stylesheet">
    <!--<link href="css/style_header.css" rel="stylesheet">-->
  </head>      
  <body>
    <div class="container">
      <div class="row clearfix">
        <div class="col-md-4 column">
          <img alt="logo" src="./images/source.png">
        </div>
        <div class="col-md-8 column dbf">
          <h2>DBA Factory</h2>
        </div>
      </div>
      <div class="row clearfix">
        <div class="col-md-12 column">
          <div class="tabbable" id="tabs-775712">
            <ul class="nav nav-tabs">
              <li>
                <a href="../dbafactory/home_page.php?sub=1" data-toggle="tab">Home</a>
              </li>
              <li>
                <a href="../dbafactory/form_page.php?sub=2" data-toggle="tab">Submit a project</a>
              </li>
              <li>
                <a href="../dbafactory/view_table.php?sub=3" data-toggle="tab">All Projects</a>
              </li>
              <li>
                <a href="#panel-4" data-toggle="tab">Innovative Ideas</a>
              </li>
              <li>
                <a href="#panel-5" data-toggle="tab">Matchmaker</a>
              </li>
              <li>
                <a href="#panel-6" data-toggle="tab">Meet the Team</a>
              </li>
            </ul>
          </div>
          <div class="dropdown">
            <?php include "userlogin.php"; ?>
          </div>
        </div>
      </div>
  </div>
</body>

<script>
  $('.dropdown-toggle').dropdown();
  $('#userlogin').dropdown('toggle');
</script>

userlogin.php

if ($loginid!="")
{
  echo "<a id=\"userlogin\" role=\"button\" data-toggle=\"dropdown\" href=\"#\">" .$loginid. "<span class=\"caret\"></span></a>";
  //echo "<li role=\"presentation\"><a role=\"menuitem\" tabindex=\"-1\" href=\"#\">" .$loginid. "</a></li>";
  echo "<ul class=\"dropdown-menu\" role=\"menu\" aria-labelledby=\"userlogin\">";
  echo "<li role=\"presentation\"><a role=\"menuitem\" tabindex=\"-1\" href=\"#\">Settings</a></li>";
  echo "<li role=\"presentation\" class=\"divider\"></li>";
  echo "<li role=\"presentation\"><a role=\"menuitem\" tabindex=\"-1\" href=\"http://profilelink\">My Profile</a></li>";
  echo "<li role=\"presentation\"><a role=\"menuitem\" tabindex=\"-1\" href=\"https://logoutpage\"> Sign Out </a></li>";
  echo "</ul>";
}
else
{
  echo "<a id=\"userlogin\" role=\"button\" data-toggle=\"dropdown\" href=\"#\"> User <span class=\"caret\"></span></a>";
  echo "<ul class=\"dropdown-menu\" role=\"menu\" aria-labelledby=\"userlogin\">";
  echo "<li role=\"presentation\"><a role=\"menuitem\" tabindex=\"-1\" href=\"https://reloginpage\"> Sign In </a></li>";
  echo "</ul>";
}

我可以在主登录页面上获取用户ID。下拉列表在jsfiddle上工作正常,但在相关页面上没有。当我使用Firebug进行调试时。我看到标签没有突出显示,但标签,即用户标识突出显示。这可能是个问题吗?

有人可以告诉我这里有什么问题吗?我该如何解决这个问题并进行调试?

1 个答案:

答案 0 :(得分:0)

确保在文档的<?php include "userlogin.php"; ?>中加入<body>。您无法在<head>中输出div和列表。

将所有JS库e.t.c直接包含在您身体的END(直接在</body>标记之前)也是一种很好的做法。就像那样,网站的渲染不会被阻止。

编辑: @rond为了防止你还没弄明白,我创造了一个要点(未经测试)应该如何看待 - &gt; https://gist.github.com/sidneywidmer/8839857