网站在一些jQuery $ .ajax调用后失去了性能

我承认我对完整的ajax网站很满意，所以我肯定会犯一些错误。

问题是这样的：在 http://lamovida.arabianessence.com

每一页都在使用此功能

function getAjaxPage() { 
    $('a.ajaxc').click(function() { 
$("li.page_block").find(".wrapper").fadeOut(400).remove(); 
    hideSplash(); 
    var $thishref = $(this).attr('href'), 
     $thisurl = $thishref.replace("#!/",""), 
     $urlArr = $thisurl.split('-'), 
     $urlOk = $urlArr[0], 
     $dataOk = $urlArr[1]; 

     $.ajax({ 
     url : $urlOk + ".php", 
    data : 'id='+$dataOk, 
    success : function (data,stato) { 
     $("#content").css({opacity:1}).fadeIn(400); 
     $("li.page_block").html(data); 
     $("li.page_block").css('visibility', 'visible'); 
     $("li.page_block").find(".wrapper").css({opacity:0}).show().animate({opacity:1},1000); 

       var $whgt = $(".wrapper").height(), 
        $ctop = (($(window).height() - $whgt) /2)-40; 

       $("#content").stop().animate({height: $whgt+40, top: $ctop},1000); 
       $("li.page_block").css('padding-top',20); 

       $('.scrollable').jScrollPane(); 
       $('.slider>ul>li').jScrollPane(); 

       getAjaxPage(); 
      }, 
      error : function (richiesta,stato,errori) {      
       alert(errori); 
      } 
     }); 
    }); 
}

每次调用该函数的内容变得装载机慢，加载后用$就调用大约20次点击事情变得非常糟糕，并且加载时间不断增长。

我试图用谷歌浏览器的时间轴来分析这种情况，我发现每次点击后浏览器都会使用更多的内存。如果我评论getAjaxPage（）;排在“成功”部分的情况开始变得更好，但当然我失去了所有的内部导航。

我该怎么做才能避免这个问题？

非常感谢大家！

来源

2013-02-11 MarcoMagnano

每次拨打$('a.ajaxc').click()的电话号码是都会添加新的事件处理程序因此每次点击都会导致发出更多请求。第一次点击后，每次点击都会导致两次请求。另一次点击？另外三个请求。等

把处理功能外，你将有只有一个每次点击AJAX调用：

$(document).ready(function() { 
    $('a.ajaxc').click(getAjaxPage); 
});

我还没有看到背后从回调中再次调用getAjaxPage的原因，因此将其删除以避免无限循环的请求。

来源

2013-02-11 15:14:39

感谢您的好评！从回调中再次调用getAjaxPage（）的原因是我需要使加载ajax的内容中的所有链接的行为与主导航内容完全相同。有没有办法做到这一点？ – MarcoMagnano 2013-02-11 16:00:41

好吧，没事。我使用.live（）函数，并且所有东西都像charme一样工作。 – MarcoMagnano 2013-02-11 16:16:41

干杯，但不要使用'.live（）'，因为它已被弃用。改用'.on（）'。 :) – 2013-02-11 19:23:53

网站在一些jQuery $ .ajax调用后失去了性能

回答

相关问题