2012-08-26 36 views
1

我想让一小块AJAX工作。它提醒我正确的网址,但无法加载页面。 这是ajax.js:我该如何使这个AJAX工作?

$(document).ready(function() { 
    $('#sidebar-content ul li a').click(function(){ 
    var toLoad = $(this).attr('href'); 
    $('#content').load(toLoad); 
    return false; 
}); 
}); 

我使用Laravel这里是我的default.template.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>{{$title}}</title> 
    <meta name="description" content="Empire - XHTML Template" /> 
    {{ HTML::style('css/style.css') }} 
    {{ HTML::script('js/jquery.min.js') }} 
    {{ HTML::script('js/ajax.js') }} 

    <!-- PAGE OPENING ANIMATION --> 
    <script type="text/javascript"> 
     jQuery(document).ready(function() 
     {jQuery('#page').css({'display':'inline','width':'300px','overflow':'hidden','margin-right':'340px'}); 
     jQuery('#sidebar').css({'margin-left':'326px'});}); 
     jQuery(window).load(function() {jQuery('#hp_preloader').delay(800).animate({'opacity':'0'},1400,function() 
     {jQuery('#slider-nivo').nivoSlider(
     {controlNav:true,controlNavThumbs:false,keyboardNav:false,pauseOnHover:false,prevText:'',nextText:'',effect:'fade',animSpeed:300,pauseTime:4000}); 
     jQuery(this).remove();jQuery('#sidebar').delay(800).animate({'margin-left':'0px'},2100);jQuery('#page').delay(800).animate({'margin-right':'0px','width':'666px'}, 
     2100);});}); 
    </script> 
    <meta charset="UTF-8"> 
</head> 
    <body> 

<!-- SITE WRAPPER --> 
<div id="wrapper"> 
<div id="page"> 
<div id="content"> 
{{ $content }} 
<!-- SIMPLE HORIZONTAL LINE --> 
<div class="hr2"></div> 
</div> 
<!-- #content ends --> 
</div> 
    <!-- #page ends --> 
<!-- SIDEBAR --> 
<div id="sidebar"> 
     <div id="sidebar-content"> 

    <!-- MENU --> 
    <ul id="menu"> 
    <li class="current"><a href="<?php echo URL::to_route('articles'); ?>">ANASAYFA</a></li> 

    <li><a href="<?php echo URL::to_route('abouts'); ?>">HAKKIMIZDA</a></li> 
    <li>HİZMETLERİMİZ 
    <ul> 
    <li><a href="./blog3.html">Eğitim Hizmetlerimiz</a></li> 
    <li><a href="./portfolio-3c.html">Neurofeedback</a></li> 
<li><a href="./portfolio-2c.html">Biofeedback</a></li> 
    </ul> 
</li>  
</div> 
    <!-- #sidebar ends --> 
    </div> 
    <!-- #wrapper ends --> 
</body> 
</html> 

有一个动画,当你进入页面。当我点击链接时,如果我点击警报,地址显示正确,但没有内容打开,并且Java控制台显示所有脚本文件再次加载。你能检查它吗?

回答

1

它看起来像你忘了阻止A -tags默认行为,这是重定向。修改点击事件,像这样:

$('#sidebar-content ul li a').click(function (e) { 
    e.preventDefault(); // Prevents link's default behavior. 
    var toLoad = $(this).attr('href'); 
    $('#content').load(toLoad); 
    return false; 
}); 

如果仍然没有工作,使用console.log()进行调试,就像这样:

$('#sidebar-content ul li a').click(function (e) { 
    e.preventDefault(); // Prevents link's default behavior. 
    var toLoad = $(this).attr('href'); 
    console.log(toLoad); // whats in toLoad? 
    console.log($("#content")); // maybe content isnt there? 
    $('#content').load(toLoad); 
    return false; 
}); 
+0

它并没有帮助还是同样的问题。 – ytsejam

+0

确保硬刷新页面(Ctrl + F5) – Jeff

+0

此外,Sidebar代码是否正在加载页面,还是正在使用AJAX加载? – Jeff