jQuery for 루프 숨기기 요소 표시

Question

jQuery에서 for 루프에 문제가 있습니다. 마지막 광고까지 동적으로 순환 게재되는 광고 섹션을 만들려고합니다.

불행히도 jQuery는 내 증분 자에 대한 정적 값을 제공합니다.

여기에 관련이있을 수 그 일이 일어나고 몇 가지가 있습니다 내 코드

function ads(){ 

    var i = 0; 

    for(i=0; i<=3; i++){  
     $("#adBox").delay(5000).hide("slide", { direction: "up" }, 1000);  
     $("#adBox").delay(1000).show("slide", { direction: "right" }, 1000);  
     $("#adContent").load("adPage" +i+".php"); 
    } 
}  
ads(); 

Answer 1

입니다 :

• 루프 구문에 분명히 아무 문제가 없습니다. ,

 
i: 0 
i: 1 
i: 2 
i: 3 

• 루프가 실행될 때마다 다음과 같은 일이 일어날 것입니다 : 당신은 루프 내에서 console.log("i: " + i);를 추가하는 경우이 코드가 실행될 때, 당신은 예를 들어, 브라우저의 자바 스크립트 콘솔에 기록 된 네 개의 라인을 볼 수

  1. #adBox 요소의 애니메이션 대기열에 5 초의 지연이 추가 된 다음 슬라이드 위로 애니메이션이 대기열에 추가됩니다.
  2. 지연 또는 애니메이션 시작을 기다리지 않고 대기열에 항목을 추가 한 직후 다른 지연 및 슬라이드 오른쪽 애니메이션이 동일한 요소의 대기열에 추가됩니다.
  3. 지연이나 애니메이션이 실행될 때까지 기다리지 않고 "adPage" + i + ".php"을 호출합니다. 페이지가 반환되면 요소 #adContent에로드됩니다. 그러나 .load() 메서드는 페이지가 검색되거나로드 될 때까지 기다리지 않고 바로 을으로 반환합니다.

• for 루프는 .load()에 대한 첫 번째 호출이 완료되기 전에 네 번의 반복을 모두 완료합니다.

• 마지막으로 전문 용어에 대한 참고 사항 : for 루프는 JavaScript에 기본 제공됩니다. JavaScript 라이브러리 인 jQuery와는 아무런 관련이 없습니다.

  function ads(i) { 
      if (i <= 3) { 
       $("#adBox").delay(5000).hide("slide", { direction: "up" }, 1000, function() { 
        $("#adBox").delay(1000).show("slide", { direction: "right" }, 1000, function() { 
         $("#adContent").load("adPage" + i +".php", function() { 
          ads(i + 1); 
         }); 
        }); 
       }); 
      } 
  } 
  

  나는 쇼를 숨길 통과하고있어 그 익명 함수의 인수 및로드 콜백 기능은 다음과 같습니다

나는 당신이 정말 일이 원하는 것은 이런 일이라고 생각한다. 각 기능이 완료된 후에 만 ​​실행됩니다.