如果计数器达到最大计数 counter++ else counter = 0 in javascript

Question

好吧，所以我希望如果我的计数器达到最大计数，它就会重新开始，默认计数器编号为 0 这是我的代码：

var picCount = 0; // global
 var maxCount = 4;
 //Pictures, to add more then 4 pics, add var picFive = "link to image here", var picSix ="bla", you get it.. add in picArray ,picFive and ,picSix
 //To change the time delay, change it at the body onload and on the setTimeout
 var picOne = "http://screenshots.nl.sftcdn.net/nl/scrn/3342000/3342167/modloader-for-minecraft-02-700x406.jpg"
 var picTwo = "http://media.moddb.com/images/downloads/1/31/30912/minecraft_blox.png"
 var picThree = "http://www.mupload.nl/img/rl6zeofbb.png"
 var picFour = "http://www.mupload.nl/img/rl6zeofbb.png"

 var picArray = [picOne, picTwo, picThree, picFour]

 //  
 // gets next picture in array
     function nextPic() { // check if adding 1 exceeds number of pics in array
         if (picCount.length < maxCount.length) {
             picCount = (picCount + 1 < picArray.length) ? picCount + 1 : 5000;
             // build the image to write to page using the new pic reference
             var build = '<img border="0" src="' + picArray[picCount] + '" width="649">\n';
             document.getElementById("imgHolder").innerHTML = build;
             // repeat this every    10 seconds. 
             setTimeout('nextPic()', 10 * 1000) //setTimeout is here
         } else {
             picCount = (picCount - maxCount < picArray.length) ? picCount + 1 : 5000;
             // build the image to write to page using the new pic reference
             var build = '<img border="0" src="' + picArray[picCount] + '" width="649">\n';
             document.getElementById("imgHolder").innerHTML = build;
             // repeat this every    10 seconds. 
             setTimeout('nextPic()', 10 * 1000) //setTimeout is here
         }
     }

好的，所以我希望你们能帮我解决这个问题..

Answer 1

这是很多混乱的代码。 我对实现的修复可能如下所示：

var currentPic = 0;
var picOne = "http://screenshots.nl.sftcdn.net/nl/scrn/3342000/3342167/modloader-for-minecraft-02-700x406.jpg"
var picTwo = "http://media.moddb.com/images/downloads/1/31/30912/minecraft_blox.png"
var picThree = "http://www.mupload.nl/img/rl6zeofbb.png"
var picFour = "http://www.mupload.nl/img/rl6zeofbb.png"

var picArray= [picOne,picTwo,picThree,picFour]

function nextPic()  {
    if (currentPic < picArray.length) {currentPic++;}
    else {currentPic = 0;}

    var build='<img border="0" src="'+picArray[currentPic]+'" width="649">';
    document.getElementById("imgHolder").innerHTML=build;
    // repeat this every    10 seconds. 
    setTimeout('nextPic()',10 * 1000)//setTimeout is here
}

Answer 2

尽管我确信您的代码中存在许多其他问题，但我相信这一行是问题中解决的特定问题的原因：

if (picCount.length < maxCount.length) {

maxCount

和

picCount

只是数字。它们没有长度属性。改成这样：

if (picCount < maxCount) {

Answer 3

var currentPic = 0;
var picArray= ["http://screenshots.nl.sftcdn.net/nl/scrn/3342000/3342167/modloader-for-minecraft-02-700x406.jpg",
               "http://media.moddb.com/images/downloads/1/31/30912/minecraft_blox.png",
               "http://www.mupload.nl/img/rl6zeofbb.png",
               "http://www.mupload.nl/img/rl6zeofbb.png"];

function nextPic()  {
    (currentPic < picArray.length) ? currentPic++ : currentPic = 0;
    var build='<img border="0" src="'+picArray[currentPic]+'" width="649">';
    document.getElementById("imgHolder").innerHTML=build;
}

setTimeout('nextPic()',10 * 1000);

我做了一些更改，使您的代码更加简洁。 一些提示：

• 在将图像 URL 放入数组之前，无需将其存储在 vars 中。只需用它们初始化您的数组即可。
• 不要重复自己。每当您发现自己在多个地方使用完全相同的代码时，您可能需要重新思考如何解决问题。
• 查找“三元运算符”。在我看来，它使简单的条件语句更易于阅读。
• 无需使用 maxCount - 最大计数将是 picArray 的长度。
• 虽然通常不需要，但尝试以分号结束所有语句。