0

我有一个包含长分页内容的页面。现在为了访问一个项目，我想加载页面，直到找到所需的项目。问题是我的“while”循环总是进入无限循环。经过一些研究，我发现由于 ajax 的异步行为，它永远找不到元素。这是我正在使用的代码

用于加载内容直到找不到元素的 While 循环：

$(document).ready(function(){
    if(document.getElementById('selectedItem')) {
        totalPages = $("#selectedItem").attr("totalPages");
        trgtElementUrl = $("#selectedItem").val();

        var targetElement = $("#" + trgtElementUrl);
        i = 2;

        //getting $('#'+trgtElementUrl).length always 0

        while(!($('#'+trgtElementUrl).length)) {
            $('#page' + i).trigger("click");
            i++;
        }

        target_top = $('#'+trgtElementUrl).offset().top;
        target_top = target_top - 10;

        $('html, body').animate({scrollTop:target_top}, 500);

        $(".summaries li").removeClass();

        $('#'+trgtElementUrl).addClass('active');
    }

});

并通过触发点击事件进行ajax调用 

$('a.loadMore').live("click",function(event){
    $(this).hide();
    $(".loaderImage").show();
    event.preventDefault();
    var link = $(this).attr("href");
    $.ajax({
        url: link,
        dataType: "html",
        success: function(data) {

            if($('a.loadMore').parent().parent().hasClass('advertisingGrid')){
                var items = $(data).find('ul.advertisingGridItems').html();
                $(items).hide().appendTo('ul.advertisingGridItems').show('normal');
            } else {
                var items = $(data).filter('ul.summaries').html();
                var subnav = $(data).filter('nav.subnav');
                var itemLinks = $(subnav).find('ul').html();
                $('div#pagination').remove();
                $(items).appendTo('ul.summaries');
                $(itemLinks).appendTo('.subnav ul');
            }

            $(".loaderImage").hide();
        }
    });
    return false;
});

这始终适用于同步 ajax 调用。是否可以在没有同步 ajax 调用的情况下使其工作。谢谢

4

1 回答 1

1

而不是请求单个页面，而是更改您的 AJAX 请求以包含您正在搜索的项目的名称/ID 和当前页码。

让服务器端代码使用当前页面和目标页面（包含目标项目的页面）之间的页面/项目列表对此进行响应。

收到响应后，根据客户端请求为收到的页面设置动画（与您现在执行的方式相同）。

这里的不同之处在于您正在发出一个异步请求，并且您收到了所有需要的数据。从那里开始，您可以使用 CSS 和 JS 以任何您想要的方式制作动画。

这种方法的另一个好处是您可以正确处理连接错误、请求异常和其他在未找到目标项时可能导致的异常。

于 2013-07-18T16:27:51.117 回答