侧边栏菜单选项卡从HTML到jQuery

我希望这段代码包含一些jQuery，以便当我按下侧边栏菜单上的一个选项卡时，它会显示在同一页面上的容器中的数据，而无需刷新页面。我尝试过这样做，但是他们都没有为我工作。侧边栏菜单选项卡从HTML到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>

来源

2016-03-27 JackDaniels

<!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>

来源

2016-03-28 09:28:57

我在这里提供了一个希望对你有用的示例代码。 test.html页面只包含右侧html –

感谢您的代码。我已将页面链接到各自的选项卡，但是当我按下选项卡时，它不显示在框中。 – JackDaniels

看看我们基本上在这里做了什么，我们只需要在页面名称作为参数点击每个标签时调用一个函数。 jQuery加载函数调用该页面并替换结果id html代码。所以确保你有插入请求数据到有效的ID。请与我共享至少一页代码。所以我可以更有效地帮助你。 –

嗯，我没有得到你的完整问题，但正如我所了解的，它是从侧边栏菜单中链接页面的问题。如果你发帖的菜单代码可能会让我很好理解。

来源

2016-03-27 22:39:40

我已经包括工具栏菜单上面的代码 – JackDaniels

有此链接可能会有所帮助[CSS技巧]看看（https://css-tricks.com/ajax-load-container-contents/） –

侧边栏菜单选项卡从HTML到jQuery

回答

相关问题