SetInterval不从interval开始递增

时间:2013-12-16 08:15:59

标签: javascript jquery settimeout setinterval

haha = 0;
function dodat(){
haha++;
code here...
}
setInterval(function(){
dodat();
}, 1500-haha);

奇怪的是,似乎时间实际上并没有被添加到setinterval ...

以下是我的代码,SetInterval从第57行开始,函数dodat()

<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>

<!DOCTYPE html>

<body onkeypress="pretend();">
<span id="money">25</span>$ - <span id="lives">100</span>/100 lives
<br><br>
<span style="background-color:#2cafe4;cursor:pointer;width:1000px;height:175px;overflow:hidden;position:relative;display:block;" id="track"></span>
<br>
<span id="divthing" style="position:relative;display:block;"></span>


<script>
    money = 25;
    lives = 100;
    mycars = {};
    original = 0;

    function doofus() {
if($("div:first").offset().left > 1000){
        $("div:first").remove();
        lives = lives-1;
        document.getElementById("lives").innerHTML = lives;
}
}
haha = 0;
    function dodat() {
    haha = haha+100;
            var btn = document.createElement("div");
        anyArray = new Array('http://i44.tinypic.com/i4l1r8.png', 'http://i41.tinypic.com/nxs4k8.jpg');
        function randOrd(){
return (Math.round(Math.random())-0.5); }
        anyArray.sort(randOrd);
        btn.innerHTML="<img src='"+anyArray+"' style='height:60px;'>";
        btn.style.position = "absolute";
        btn.style.left = "0px";
        var numba = Math.round(Math.random() * 50);
        btn.class = "haha";
        btn.id = numba;
        mycars[numba] = -50;

        var move = function () {
            mycars[numba] = mycars[numba] + 1.5;
            document.getElementById(numba).style.left = mycars[numba] + "px";
            if(mycars[numba] > 100 && mycars[numba] < 150){
            document.getElementById(numba).style.top = mycars[numba]/0.5-200 + "px";
            }
        };

        setInterval(move, 10);

        document.getElementById("track").appendChild(btn);
    }
    setInterval(function(){
    dodat();
}, 1500-haha);
    setInterval(doofus, 200);

    function dis1() {
        $("#shoot1").css("background-color", "red");
        setTimeout('$("#shoot1").css("background-color", "blue");', '1000');
    compareEl = $("#shoot1");
        // Let's find the closest block!
        var otherEls = $('div'),
            compareTop = compareEl.offset().top,
            compareLeft = compareEl.offset().left,
            winningScore = Infinity,
            score, winner, curEl;

        otherEls.each(function () {
            // Calculate the score of this element
            curEl = $(this);
            score = Math.abs(curEl.offset().left - compareLeft);
            if (score < winningScore) {
                winningScore = score;
                winner = this;
            }
        });
        $("#"+winner.id+"").remove();

        money = money+1;
        document.getElementById("money").innerHTML=""+money+"";
}

    function dis2() {
        $("#shoot2").css("background-color", "red");
        setTimeout('$("#shoot2").css("background-color", "blue");', '1000');
    compareEl2 = $("#shoot2");
        // Let's find the closest block!
        var otherEls2 = $('div'),
            compareTop2 = compareEl2.offset().top,
            compareLeft2 = compareEl2.offset().left,
            winningScore2 = Infinity,
            score2, winner2, curEl2;

        otherEls2.each(function () {
            // Calculate the score of this element
            curEl2 = $(this);
            score2 = Math.abs(curEl2.offset().left - compareLeft2);
            if (score2 < winningScore2) {
                winningScore2 = score2;
                winner2 = this;
            }
        });
        $("#"+winner2.id+"").remove();

        money = money+1;
        document.getElementById("money").innerHTML=""+money+"";
}

    function dis3() {
        $("#shoot3").css("background-color", "red");
        setTimeout('$("#shoot3").css("background-color", "blue");', '1000');
    compareEl3 = $("#shoot3");
        // Let's find the closest block!
        var otherEls3 = $('div'),
            compareTop3 = compareEl3.offset().top,
            compareLeft3 = compareEl3.offset().left,
            winningScore3 = Infinity,
            score3, winner3, curEl3;

        otherEls3.each(function () {
            // Calculate the score of this element
            curEl3 = $(this);
            score3 = Math.abs(curEl3.offset().left - compareLeft3);
            if (score3 < winningScore3) {
                winningScore3 = score3;
                winner3 = this;
            }
        });
        $("#"+winner3.id+"").remove();

        money = money+1;
        document.getElementById("money").innerHTML=""+money+"";
}


    function dis4() {
        $("#shoot4").css("background-color", "red");
        setTimeout('$("#shoot4").css("background-color", "blue");', '1000');
    compareEl4 = $("#shoot4");
        // Let's find the closest block!
        var otherEls4 = $('div'),
            compareTop4 = compareEl4.offset().top,
            compareLeft4 = compareEl4.offset().left,
            winningScore4 = Infinity,
            score4, winner4, curEl4;

        otherEls4.each(function () {
            // Calculate the score of this element
            curEl4 = $(this);
            score4 = Math.abs(curEl4.offset().left - compareLeft4);
            if (score4 < winningScore4) {
                winningScore4 = score4;
                winner4 = this;
            }
        });
        $("#"+winner4.id+"").remove();

        money = money+1;
        document.getElementById("money").innerHTML=""+money+"";
}


    function dis5() {
        $("#shoot5").css("background-color", "red");
        setTimeout('$("#shoot4").css("background-color", "blue");', '1000');
    compareEl5 = $("#shoot5");
        // Let's find the closest block!
        var otherEls5 = $('div'),
            compareTop5 = compareEl5.offset().top,
            compareLeft5 = compareEl5.offset().left,
            winningScore5 = Infinity,
            score5, winner5, curEl5;

        otherEls5.each(function () {
            // Calculate the score of this element
            curEl5 = $(this);
            score5 = Math.abs(curEl5.offset().left - compareLeft5);
            if (score5 < winningScore5) {
                winningScore5 = score5;
                winner5 = this;
            }
        });
        $("#"+winner5.id+"").remove();

        money = money+1;
        document.getElementById("money").innerHTML=""+money+"";
}

function whatareyousingingpatrick(){
if(money >= 15){
money = money-15;
original = original+1;
        setInterval("dis"+original+"();", 2400);
        var btn = document.createElement("shooter");
        btn.style.display = "block";
        btn.id = "shoot"+original+"";
        btn.style.height = "25px";
        btn.style.width = "25px";
        btn.style.backgroundColor = "blue";
        btn.innerHTML = "<img src='http://www.bubblews.com/assets/images/news/1317280976_1370202845.png' style='height:100%;width:100%;border-radius:100%;opacity:0.7;'>";
        btn.style.borderRadius= "100%";
        btn.style.boxShadow= "0px 0px 200px 75px rgba(0, 0, 0, 0.2)";
        btn.style.position = "absolute";
        btn.style.left = event.pageX-8;
        btn.style.top = event.pageY-44;
        document.getElementById("track").appendChild(btn);
}
else{
alert("Sorry, this dude costs 15 bucks.");
}
}

function whatareyousingingpatrick2(){
if(money >= 25){
money = money-25;
original = original+1;
        setInterval("dis"+original+"();", 2000);
        var btn = document.createElement("shooter");
        btn.style.display = "block";
        btn.id = "shoot"+original+"";
        btn.style.height = "25px";
        btn.style.width = "25px";
        btn.style.backgroundColor = "blue";
        btn.innerHTML = "<img src='http://static3.wikia.nocookie.net/__cb62439/xwing-miniatures/images/thumb/1/18/Missile_Icon.png/100px-0,111,0,110-Missile_Icon.png' style='height:100%;width:100%;border-radius:100%;opacity:0.7;'>";
        btn.style.borderRadius= "100%";
        btn.style.boxShadow= "0px 0px 200px 75px rgba(0, 0, 0, 0.2)";
        btn.style.position = "absolute";
        btn.style.left = event.pageX-8;
        btn.style.top = event.pageY-44;
        document.getElementById("track").appendChild(btn);
}
else{
alert("Sorry, this dude costs 25 bucks.");
}
}

function pretend(){
   if (event.keyCode == 13) {
if(money >= 5){
money = money-5;
   $("div").hide();
   alert("You have bought the INSTANT KILL feature. Note that you can purchase this feature an unlimited number of times.");
   }
else
{
alert("Sorry, the cost of the INSTANT KILL feature is 5$");
}
}
if (event.keyCode == 49) {
if(money >= 40){
money = money-40;
   alert("You have bought the FASTER SHOOTING upgrade for your first missile. Note that you can purchase this upgrade an unlimited number of times.");
   setInterval("dis1();", "8000");
   }
   else
{
alert("Sorry, the cost of the FASTER SHOOTING upgrade for this missile is 40$");
}
   }
   if (event.keyCode == 50) {
if(money >= 40){
money = money-40;
   alert("You have bought the FASTER SHOOTING upgrade for your second missile. Note that you can purchase this upgrade an unlimited number of times.");
   setInterval("dis2();", "8000");
   }
   else
{
alert("Sorry, the cost of the FASTER SHOOTING upgrade for this missile is 40$");
}
   }
   if (event.keyCode == 51) {
if(money >= 40){
money = money-40;
   alert("You have bought the FASTER SHOOTING upgrade for your third missile. Note that you can purchase this upgrade an unlimited number of times.");
   setInterval("dis3();", "8000");
   }
   else
{
alert("Sorry, the cost of the FASTER SHOOTING upgrade for this missile is 40$");
}
   }
   if (event.keyCode == 52) {
if(money >= 40){
money = money-40;
   alert("You have bought the FASTER SHOOTING upgrade for your fourth missile. Note that you can purchase this upgrade an unlimited number of times.");
   setInterval("dis4();", "8000");
   }
   else
{
alert("Sorry, the cost of the FASTER SHOOTING upgrade for this missile is 40$");
}
   }
}
</script>
<br><br>
<button onclick='$("#track").on("click", function() { whatareyousingingpatrick(); });'>
Get sniper for 15$
</button>
<br>

<button onclick='$("#track").on("click", function() { whatareyousingingpatrick2(); });'>
Get bomb for 25$
</button>

2 个答案:

答案 0 :(得分:5)

setInterval(function(){
   dodat();
}, 1500-haha);

1500-haha部分仅评估一次,这意味着-haha无用。

如果您希望每次调用时减少间隔,可以使用setTimeout:

(function doone(){
    dodat();
    setTimeout(doone, 1500-haha); // a halting condition here would be nice
})();

答案 1 :(得分:0)

setInterval只会读取该值一次。如果你想再次阅读它,你必须清除间隔并重新启动它。

类似的东西:

var theInterval = setInterval(function () {
    dodat();
}, 1500);
setInterval(doofus, 200);

function reSetIntevar(value) {
    clearInterval(theInterval);
    theInterval = setInterval(function () {
        dodat();
    }, 1500 - value);
    setInterval(doofus, 200);
}