我正在尝试使用ajax,因此页面不会自动刷新,但由于某种原因,我似乎无法让它工作。我使用这个Link
来实现这个效果你可以看到它如何在没有重新加载的情况下滑动,但是我似乎无法让网站完全工作甚至重新加载。当我点击链接时,什么都没有出现。
我正在尝试使用登录和注册页面。当我点击链接时,没有任何反应。
再次感谢您的帮助。
<div class="navbar navbar-default" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class = "logo">
<img src="Image/Logo.png" class="img-responsive"/>
</div>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="index.php">Home</a>
</li>
<li><a href="about.php">About</a>
</li>
<li><a href="login.php">Login</a>
</li>
<li><a href="reg.php">Become A member</a>
</li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="Mainbody">
<div class="linetop">
<div class="linebottom">
<h3>JULY 19th, 2016</h3>
<!-- <h1><span>J</span>UST <span>J</span>UICE</h1> -->
<h1>INTO THE NEW YOU</h1>
<h2>THE APPLICATION TO A HEALTHIER LIFESTYLE</h2>
<div class="bottop">
<div class="botbottom"></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="container">
<div class="navbar-text pull-left">
<div class="logo1">
<img src="Image/Logo.png" class="img-responsive"/>
<p>© 2016 by JJ. CopyRight Ali Issa</p>
</div>
</div>
<div class="navbar-text pull-right">
<a href="#"><i class="fa fa-facebook fa-2x"></i></a>
<a href="#"><i class="fa fa-twitter fa-2x"></i></a>
<a href="#"><i class="fa fa-instagram fa-2x"></i></a>
</div>
</div>
</div>
<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js'></script>
<script type='text/javascript' src='js/jquery.ba-hashchange.min.js'></script>
<script type='text/javascript' src='js/dynamicpage.js'></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(function() {
var newHash = "",
$mainContent = $("#main-content"),
$pageWrap = $("#page-wrap"),
baseHeight = 0,
$el;
$pageWrap.height($pageWrap.height());
baseHeight = $pageWrap.height() - $mainContent.height();
$("nav").delegate("a", "click", function() {
window.location.hash = $(this).attr("href");
return false;
});
$(window).bind('hashchange', function(){
newHash = window.location.hash.substring(1);
if (newHash) {
$mainContent
.find("#guts")
.fadeOut(200, function() {
$mainContent.hide().load(newHash + " #guts", function() {
$mainContent.fadeIn(200, function() {
$pageWrap.animate({
height: baseHeight + $mainContent.height() + "px"
});
});
$("nav a").removeClass("current");
$("nav a[href='"+newHash+"']").addClass("current");
});
});
};
});
$(window).trigger('hashchange');
});
编辑:
添加新代码后,现在所做的一切都是正常刷新而不是淡入,淡出