首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >通过ajax获取帖子的jQuery导致浏览器崩溃

通过ajax获取帖子的jQuery导致浏览器崩溃
EN

Stack Overflow用户
提问于 2012-03-11 20:30:11
回答 2查看 1.5K关注 0票数 0

我有一个社交网站,在主提要页面上,我编写了一些jQuery,以便当用户在接近页面底部时向下滚动,下一组帖子将使用ajax检索并附加到DOM中。但是,在每次ajax请求之后,浏览器的速度会变慢,到第三个或第四个请求时,它会崩溃。下面是我的代码:

代码语言:javascript
运行
复制
    feed_offset = posts_offset = post_comments_offset = 0;
    loading_posts = loading_post_comments = loading_feed = false;
    posts_end = post_comments_end = feed_end = false;

/* Automatically get new posts as the user scrolls down */
    $(window).scroll(function() {
        if ($('body').height() <= ($(window).height() + $(window).scrollTop() + 100)) {
            // get more posts
            if($('#all').is(':visible')) { // more of everything for all tab
                if(loading_feed==false && feed_end==false) {

                    loading_feed = true;
                    $('#all .span12.columns .loading').show();

                    $.post('/feed/ajax_get_more_feed/'+feed_offset, function(data) {
                        $('#all .span12.columns .loading').hide().before(data);
                        feed_offset+= 10;
                        loading_feed = false;
                        if(data=='') {
                            feed_end = true;
                        }
                    });
                }
            } else if($('#posts').is(':visible')) { // more posts for posts tab
                if(loading_posts==false && posts_end==false) {

                    loading_posts = true;
                    $('#posts .span12.columns .loading').show();

                    $.post('/feed/ajax_get_more_feed_posts/'+posts_offset, function(data) {
                        $('#posts .span12.columns .loading').hide().before(data);
                        posts_offset+= 10;
                        loading_posts = false;
                        if(data=='') {
                            posts_end = true;
                        }
                    });
                }
            } else { // more post comments for post comments tab
                if(loading_post_comments==false && post_comments_end==false) {

                    loading_post_comments = true;
                    $('#post_comments .span12.columns .loading').show();

                    $.post('/feed/ajax_get_more_feed_post_comments/'+post_comments_offset, function(data) {
                        $('#post_comments .span12.columns .loading').hide().before(data);
                        post_comments_offset+= 10;
                        loading_post_comments = false;
                        if(data=='') {
                            post_comments_end = true;
                        }
                    });
                }
            }
        }
    });

我应该补充的是,在我添加这段代码之前,一切都运行得很好,而且它在所有浏览器中都能做到这一点。

我找到问题了!这是因为我使用的是一个类而不是一个ID,所以我有以下几点:

代码语言:javascript
运行
复制
$('#all .span12.columns .loading').hide().before(data);

我已经将带有Loading类的item更改为loading,并执行了以下操作:

代码语言:javascript
运行
复制
$('#all .span12.columns #loading').hide().before(data);

我猜想使用一个类使得jquery不得不搜索整个DOM,而使用一个ID,它知道只有一个项目,所以当它找到它时,搜索就会停止

EN

Stack Overflow用户

发布于 2012-03-11 21:03:59

正如您所说的,您正在处理一个社交网络站点,这可能是因为您同时有多个ajax调用。在发布新的Ajax调用之前,尝试使用顺序Ajax调用或使用abort终止以前的ajax调用。

票数 0
EN
查看全部 2 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9654927

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档