0

我承认我对完整的 ajax 网站非常陌生，所以我肯定会犯一些错误。

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

每个页面都使用此函数加载了 $.ajax 调用

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(); 排在“成功”部分的情况开始好转，但当然我失去了所有的内部导航。

我能做些什么来避免这个问题？

非常感谢大家！

4

1 回答 1

2

每次调用$('a.ajaxc').click()都会添加新的事件处理程序，因此每次单击都会导致更多请求。第一次点击后，每次点击都会引发两次请求。再点击一次？另外三个请求。等等。

将处理程序放在函数之外，每次点击只有一个 AJAX 调用：

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

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

于 2013-02-11T15:14:39.057 回答