2014-02-17 2 views
0

div를 카운터로 업데이트해야하는 for 루프가 있습니다.for 루프의 div 업데이트

코드는 다음과 같습니다

for(var i=0; i < $this.files.length; i++) { 
    var update = setInterval(function() { 
     $(".counter").html('<p>Processing file ' + (i+1) + ' of ' + $this.files.length + '.</p>') 
    },1000); 
//do other stuff 
} 

을가 업데이트되지 않습니다하지만.

내가 뭘 잘못하고 있니?

+1

글쎄, 당신은 업데이트 변수를 선언하고 있는거야? – berentrom

+0

'this' 또는'$ (this)'를 사용하셨습니까? – ponciste

+0

what is $ this.files.length 더 많은 코드를 게시하십시오. –

답변

2

문제는 루핑하는 동안 매초마다 영원히 작동 할 다른 간격을 $this.files.length으로 정의하는 것입니다.

대신을 시도해보십시오

var len = $this.files.length; 
var i = 0; 
var update = setInterval(function() { 
    $(".counter").html('<p>Processing file ' + (i+1) + ' of ' + len + '.</p>'); 
    if (++i == len) clearInterval(update); 
},1000); 

jsFiddle Demo

+0

"나는 "this this.files.length 다른 간격을 정의한다"라는 문장을 이해할 수 있을지 모르겠다. 나머지 기능은 완벽하게 작동합니다. div 만 업데이트하면됩니다. – Albert

+0

'$ this.files.length = 5'라고 가정 해 봅시다. 귀하의 코드는 매 1000ms마다 작동하는 5 가지 다른 간격을 정의합니다. 그것은 초마다 5 개의 다른 타이머가 작동한다는 것을 의미합니다. 그건 당신이 원하는 게 아니에요 – Itay

+0

늦게 받아 죄송합니다 upvote. 나는 며칠 동안 그 프로젝트에서 벗어났다. – Albert

0
그것은 당신이 서로 의미 후 곧 만료됩니다 여러 타이머를 매우 빠르게 난과 저점을 반복하고 설정되어 있기 때문에 단순히 작동하지 않습니다

인간의 눈에 대해서만 마지막 값만 표시되므로 다음과 같이 원하는 결과를 얻기 위해 타이머를 사용하여 루프 함수를 만들어야합니다.

function update_progress(cur, max){ 
setTimeout(function() { 
    $(".counter").html('<p>Processing file ' + cur + ' of ' +max + '.</p>'); 
    if (cur<max) {cur++; update_progress(cur,max);} 
    },1000); 
//do other stuff 
} 

update_progress(1, $this.files.length); 

지금 프로세스의 결함을 확인하고 이것이 도움이되기를 바랍니다. Emil