2016-12-30 9 views
1

私はslideShowを作成しようとしましたが、新しい引数で関数を再試行する必要がありますが、setInterval()関数を使用しようとすると関数は1回だけ実行されます。なぜ本当ですか?javascript setInterval関数が私のために機能しません

var sIndex = 0; 
var slide = document.getElementsByClassName('slide'); 

function slider(n) { 
    if (sIndex + n >= 0 && sIndex + n <= slide.length - 1) { 
    slide[sIndex].style.display = "none"; 
    sIndex += n; 
    slide[sIndex].style.display = "block"; 
    } else if (sIndex + n < 0) { 
    slide[sIndex].style.display = "none"; 
    sIndex = slide.length - 1; 
    slide[sIndex].style.display = "block"; 

    } else if (sIndex + n > slide.length - 1) { 
    slide[sIndex].style.display = "none"; 
    sIndex = 0; 
    slide[sIndex].style.display = "block"; 
    } 
} 
setInterval(function() { 
    slider(sIndex); 
}, 2000); 
+1

変数 'n'は必要ありません – Satpal

答えて

1

sIndexいつもあなたのコードを見ています。

var sIndex = 0; 
 
var slide = document.getElementsByClassName('slide'); 
 

 
function slider(n) { 
 
    // first run: n=0 plus sIndex=0, leads to sIndex stays 0 every loop 
 
    if (sIndex + n >= 0 && sIndex + n <= slide.length - 1) { 
 
    slide[sIndex].style.display = "none"; 
 
    sIndex += n; 
 
    slide[sIndex].style.display = "block"; 
 
    } else if (sIndex + n < 0) { 
 
    slide[sIndex].style.display = "none"; 
 
    sIndex = slide.length - 1; 
 
    slide[sIndex].style.display = "block"; 
 

 
    } else if (sIndex + n > slide.length - 1) { 
 
    slide[sIndex].style.display = "none"; 
 
    sIndex = 0; 
 
    slide[sIndex].style.display = "block"; 
 
    } 
 
    console.log(new Date(), sIndex) 
 
} 
 
setInterval(function() { 
 
    slider(sIndex); 
 
}, 2000);
<div class="slide"></div>

EDIT:私の答えは理由、ないソリューションを提供します。 @Satpalのコードでは次のようなコードが得られます。nを削除し、代わりに1を追加してください。

1

あなたは、変数nはそれを削除する必要はありません。

var sIndex = 0; 
var slide = document.getElementsByClassName('slide'); 

function slider() { 
    if (sIndex >= 0 && sIndex<= slide.length - 1) { 
    slide[sIndex].style.display = "none"; 
    sIndex += 1; 
    slide[sIndex].style.display = "block"; 
    } else if (sIndex < 0) { 
    slide[sIndex].style.display = "none"; 
    sIndex = slide.length - 1; 
    slide[sIndex].style.display = "block"; 
    } else if (sIndex > slide.length - 1) { 
    slide[sIndex].style.display = "none"; 
    sIndex = 0; 
    slide[sIndex].style.display = "block"; 
    } 
} 
setInterval(slider, 2000); 
関連する問題