자바 스크립트 페이지 매김 코드의 로직에 문제가 있음

Question

function Browse() 
{ 
    this.offset = 10; 
} 

/* 
* @direction is either 'next' or 'prev' 
*/ 
Browse.prototype.loadMore = function(direction) 
{ 
    var _this = this; 

    $.getJSON('/path/to/api?offset=' + this.offset, function(json) 
    { 
     _this.offset = (direction == 'next') ? _this.offset + 10 : _this.offset - 10; 

     if (_this.offset > 10) 
      previousButton.show(); 
     else 
      previousButton.hide(); 
    }); 
} 

이것은 기본 코드입니다. 사용자가 loadMore()을 트리거하는 링크를 클릭합니다. 이 함수는 offset에서 시작하는 JSON 데이터를 가져옵니다.

이 오프셋은 현재 '페이지'에 따라 변경됩니다. 첫 번째 페이지에는 0 오프셋이 있습니다. 두 번째 페이지는 10 일 것입니다. 세 번째 페이지 20, 등 ...

이 옵셋은 앞뒤로 이동함에 따라 그에 따라 변경되어야합니다. 문제는 그렇지 않다는 것입니다. 나는 이유를 볼 수 없습니다 ...

아이디어가 있으십니까?

Answer 1

ajax 호출을 실행하는 데 시간이 걸리기 때문입니다.

시도 :

//... 
var _this = this; 

$.getJSON('/path/to/api?offset=' + this.offset, function(json) { 
    //... 
}); 
_this.offset = (direction == 'next') ? _this.offset + 10 : _this.offset - 10; 
//... 

이것은 당신의 아약스 호출에서 올바른 값을 사용하고 아약스 호출이 반환하기 전에 다음 호출에 대한 오프셋 준비가 변경됩니다. 평균 시간에 오프셋이 조정 된 경우 ajax 호출의 반환 값을 무시하는 논리를 추가 할 수 있습니다.