侧边栏菜单标签从html到jquery

时间:2016-03-27 22:18:31

标签: jquery html menu

我希望这段代码包含一些jQuery,这样当我按下侧栏菜单上的一个标签时,它会在同一页面的容器中显示它的数据而不刷新页面。我已经尝试过这样做但是没有一个能为我工作。

    <div class="container-fluid">
  <h3>Your Profile <h5> Landlord </5></h3>
  <ul class="nav nav-pills nav-stacked" style="width:300px;">
     <li><a href="#">Personal Information</a></li> 
    <li> <a class="dropdown-toggle" data-toggle="dropdown" href="landlord_profile.php"> My Properties <span class="caret"></span></a>
    <ul class="dropdown-menu">
      <li><a href="landlord_addproperty.php">Add a Property</a></li>
      <li><a href="#">Edit your properties</a></li>
    </ul>
   </li>

    <li><a href="#">Upload Profile Image</a></li>
    <li><a href="deactivate_myaccount.php">Deactivate My Account</a></li>
    <li><a href="#">    Change Password </a></li>


  </ul>
</div>

2 个答案:

答案 0 :(得分:1)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>New Graph api & Javascript Base FBConnect Tutorial | Thinkdiff.net</title>
</head>
<body>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.0.min.js"></script>
<script type="text/javascript">
function call(page)
{
  $( "#result" ).load(page);
}
</script>
<div class="container-fluid" style="width:40%;float:left;">
<h3>Your Profile <h5> Landlord </5></h3>
<ul class="nav nav-pills nav-stacked" style="width:300px;">
<li><a href="javascript:;" onclick="call('test.html');">Personal Information</a></li> 
<li> <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:;" onclick="call('test.html');"> My Properties <span class="caret"></span></a>
<ul class="dropdown-menu">
  <li><a href="javascript:;" onclick="call('test.html');">Add a Property</a></li>
  <li><a href="javascript:;" onclick="call('test.html');">Edit your properties</a></li>
</ul>
</li>

<li><a href="javascript:;" onclick="call('test.html');">Upload Profile Image</a></li>
<li><a href="javascript:;" onclick="call('test.html');">Deactivate My Account</a></li>
<li><a href="javascript:;" onclick="call('test.html');">    Change Password </a></li>


  </ul>
</div>
<div id="result" style="width:60%;float:left;">sdsdsdsd</div>
</body>
</html>

答案 1 :(得分:0)

好吧,我没有收到您的完整问题,但正如我所理解的那样,您从侧栏菜单链接页面时遇到了问题。如果您发布侧面菜单代码可能会很好理解。