lazyload + ajax 沒有數據的時候的顯示，無效？

Question

var $isFetchingNotes = false; $(window).scroll(function(){ if($('#loader-blog').hasClass('nomore')) { return false; } var $scroll = $(window).scrollTop(); var $docHeight = $(document).height(); var $winHeight = $(window).height(); if($scroll === $docHeight - $winHeight){ if(!$isFetchingNotes) { $isFetchingNotes = true; $('#loader-blog').html('<img src="/images/lazyload40.svg">'); var lastDiv = $('.data-display-blog:last'); var lastId = $('.data-display-blog:last').attr('id'); var type = $('.data-display-blog:last').attr('data-type'); var query = $('.data-display-blog:last').attr('data-query'); var dataTo = 'lastid='+lastId+'&type='+type+'&query='+query; $.ajax({ type: 'POST', url:'app', data: dataTo, cache: false, success: function(data){ if(data != ''){ lastDiv.after(data); }else{ $('#loader-blog').addClass('nomore').html('nodata'); } }, complete: function () { $isFetchingNotes = false; } }); } } }); 我發現 scroll 滑到底的時候，即使後端數據是 空他也不會執行 $('#loader-blog').addClass('nomore').html('nodata'); 這段？我在裡面有加了 ： alert事件，但是都遲遲沒有反應。但我用谷歌 inspect 檢查 <div id="#loader-blog"></div> 每次滑下去都是有觸發東西的，會閃一下。（後來發現可能是觸發$('#loader-blog').html('<img src="../images/loading_v2.svg">'); ）怎麼會這樣呢？我確定後端給的值是空值... 我即使變成這樣： if(data != ''){ lastDiv.after(data); }else if(data == ''){ $('#loader-blog').addClass('nomore').html('no-data'); } 卻還是沒有反應。。。 補充： 我要如何在還沒有滾到最下面碰底的時候，就開始發出ajax請求？

Answer 1

代码目测没有问题~，能否把后端返回的数据贴出来看看，或者添加如下代码在测试下：

// 控制台查看后端返回的数据
console.log(data);
if(data != ''){
    console.log("获取到新数据");
    lastDiv.after(data);
}else{
    console.log("没有更多数据了");
    $('#loader-blog').addClass('nomore').html('nodata');
}

看下控制台结果~，如果还不能定位到错误的话，建议把控制台信息贴出来

Answer 2

complete: 请求完成后回调函数 (请求成功或失败之后均调用), 你应该在success中 当 data==='' 时，设置 $isFetchingNotes = false; 。问题应该出在这里。

Answer 3

目前来看，代码里有两个疑似的问题：

1. HTTP动词选择的是POST，但在数据上却用了GET拼接的方式。保险起见建议还是写成对象而不是字符串拼接。另外这里也可以在网络面板里看下返回的状态码是正常的200还是别的
2. scroll是个高频事件，代码里可以看到是基于标志位做的防抖，但我觉得还是把复位放到success回调最后会更好吧，或者也可以用jQ的链式写法，用$.ajax().done().done()的形式，原success内容放在第一个done回调里，标志位复位放到第二个done回调里