我有以下脚本执行'无限滚动'样式函数:
var next_page_link = $('.wp-pagenavi a:eq(-2)').attr('href');
$(window).scroll(function() {
if ($(window).scrollTop() > $(document).height() / 2) {
$.get(next_page_link, function(data){
if ($(data).find('.wp-pagenavi a:eq(-2)').attr('href') != next_page_link) {
next_page_link = $(data).find('.wp-pagenavi a:eq(-2)').attr('href');
var content = $(data).find('#multiple_product_top_container').html();
$('#multiple_product_top_container').append(content);
}
});
}
});
我遇到的一个问题是,每次$.get
函数运行时,浏览器都会冻结2-3秒或更长时间,并且只有在下一页完全加载时才会冻结。
我的问题是,是否可以将$.get
函数设置为异步运行或其他一些可以消除冻结的方法?
由于
答案 0 :(得分:3)
评论中的问题答案:How do I set it so that a new request can't happen until the old one finishes?
您使用semaphore:
var semaphore = true;
var next_page_link = $('.wp-pagenavi a:eq(-2)').attr('href');
$(window).scroll(function() {
if ($(window).scrollTop() > $(document).height() / 2 && semaphore) {
semaphore = false;
$.get(next_page_link, function(data){
semaphore = true;
if ($(data).find('.wp-pagenavi a:eq(-2)').attr('href') != next_page_link) {
next_page_link = $(data).find('.wp-pagenavi a:eq(-2)').attr('href');
var content = $(data).find('#multiple_product_top_container').html();
$('#multiple_product_top_container').append(content);
}
});
}
});
添加一个条件是一个好主意,当您已经检索到所有可能检索到的内容时,不会要求新的请求。