clearInterval（）不起作用

Question

SYNTAX ERRORS FIXED. Dreamweaver says that I have an error in my code on line 52. I can't see what is wrong? Maybe this has something to do with the fact that my if and else statements are not working.

IF AND ELSE STATEMENTS FIXED. If I test the if and else statements individually they work correctly, but when I run the entire document, they do not run. Could someone tell me if the error and my if/else statements not working are related or if there is something else wrong.

<script>
var car1=new Object();
car1.Name="Rusty";
car1.Speed="1px", 40;
car1.Distance=0;

var car2=new Object();
car2.Name="Dusty";
car2.Speed="2px", 40; 
car2.Distance=0;

var car3=new Object();
car3.Name="Crankshaft";
car3.Speed="4px", 40;
car3.Distance=0;

function runRusty(){

setInterval(function(){moveRusty()},40);

    function moveRusty(){car1.Distance=car1.Distance +1
        document.getElementById("rusty").style.marginLeft=car1.Distance + "px" 
        };
};


function runDusty(){

setInterval(function(){moveDusty()},40);

    function moveDusty(){car2.Distance=car2.Distance +1
        document.getElementById("dusty").style.marginLeft=car2.Distance + "px" 
        };
 };


function runCrankshaft(){

setInterval(function(){moveCrank()},40);

    function moveCrank(){car3.Distance=car3.Distance +1
          document.getElementById("crankshaft").style.marginLeft=car3.Distance + "px" 
        };
};


function winLose () {if (document.getElementById("rusty").style.marginLeft="900px"){
                     alert("Winner is Rusty!");
                     clearInterval(runRusty);
                     }

else    if(document.getElementById("dusty").style.marginLeft="900px"){
                    alert("Winner is Dusty!");
                    clearInterval(runDusty);
                    }

                else if(document.getElementById("crankshaft").style.marginLeft="900px"){
                    alert("Winner is Crankshaft!");
                    clearInterval(runCrankshaft);
                    };
                };
</script>

EDIT:

The if and else statements now work as I changed declared my functions globally and changed them slightly. The code now looks as such:

    var car1=new Object();
    car1.Name="Rusty";
    car1.Speed=1;
car1.Distance=0;

var car2=new Object();
car2.Name="Dusty";
car2.Speed=2; 
car2.Distance=0;

var car3=new Object();
car3.Name="Crankshaft";
car3.Speed=4;
car3.Distance=0;

var moveRusty;
var moveDusty;
var moveCrankShaft;


function runRusty(){

moveRusty=setInterval(function(){

        car1.Distance=car1.Distance + car1.Speed;
        document.getElementById("rusty").style.marginLeft=car1.Distance + "px";
        winLose();
        },40);
};


function runDusty(){

moveDusty=setInterval(function(){

        car2.Distance=car2.Distance + car2.Speed;
        document.getElementById("dusty").style.marginLeft=car2.Distance + "px"; 
        winLose();
        },40);
};

function runCrankshaft(){

moveCrankShaft=setInterval(function(){

        car3.Distance=car3.Distance + car3.Speed;
        document.getElementById("crankshaft").style.marginLeft=car3.Distance + "px"; 
        winLose();
        },40);
}

function winLose () {

    if (car1.Distance >= 900){
        alert("Winner is Rusty!");
        car1.Distance = 0;
        car1.Speed = 0;
        car2.Distance = 0;
        car2.Speed = 0;
        car3.Distance = 0;
        car3.Speed = 0;



    }

    else 

    if(car2.Distance >= 900){
        alert("Winner is Dusty!");
        car1.Distance = 0;
        car1.Speed = 0;
        car2.Distance = 0;
        car2.Speed = 0;
        car3.Distance = 0;
        car3.Speed = 0;


    }

    else 

    if(car3.Distance >= 900){
        alert("Winner is Crankshaft!");
        car1.Distance = 0;
        car1.Speed = 0;
        car2.Distance = 0;
        car2.Speed = 0;
        car3.Distance = 0;
        car3.Speed = 0;

    }
};

clearInterval(moveRusty);
clearInterval(moveDusty);
clearInterval(moveCrankShaft);

Everything works now. All the alerts happen and the position of the cars is reset. But all my clearInterval() do not work. I don't know if clearInterval() is the correct thing to use. What I want to do is reset the page so that I can run the "game" again. Right now, the only way to do that is by refreshing the page. I've double checked how I've declared my setInterval() and how I'm calling them in my clearInterval(), and as far as I can it's right?

Answer 1

You are using clearInterval() wrong. You are passing it a function parameter whereas it expects an object.

// correct usage
var time = setInterval(stuff, 100);
clearInterval(time);

Answer 2

You have a semi colon before the else. ; which is a syntax error, remove it . You have a lot of them in weird places also, I suggest you don't put them after function declarations, if blocks if/else blocks, loop blocks etc.

Answer 3

When you want to test if to things are 'equal' in a if statement, you need to use == or === and NOT =

if (document.getElementById("crankshaft").style.marginLeft = "900px") // WRONG
if (document.getElementById("crankshaft").style.marginLeft == "900px") // RIGHT
if (document.getElementById("crankshaft").style.marginLeft === "900px") // BETTER

Read the answer to the following question to know the difference between == and ===

Difference between == and === in JavaScript

Hope this helps