javascript array indexOf not working

Question

trying to build a html minesweeper game im a pretty much beginner and im trying to get a onclick to check if that box is equal to the value of a bomb spot

javascript i use to fill my "table" element ( with the id of "grid") giving each box/td an id 0-99

var gameBox = "";
for ( var i = 0 ; i < 10 ; i++ ) {

gameBox += "<tr>";
for ( var j = 0 ; j < 10 ; j++ ) {
    var idValue = i * 10 + j;
    gameBox += "<td class = 'box' id = '" + idValue + "' onclick = 'process(this);' ></td>";
}
gameBox += "</tr>";
}
document.getElementById("grid").innerHTML = gameBox;

heres the bomb array intializer giving it a length of 10

var bomb = [];

for ( var i = 0 ; i < 10 ; i++ ) {
bomb[i] = 0;
}

after user clicks start button (heres the html:)

            <input type="button" class="MtopSmall" value="start!" name = "startButton" onclick = "start();" >

they trigger the start function which assigns 10 different random numbers 0-99

function start() {

for ( var i in bomb ) {

    var number = Math.floor( Math.random() * 100 );
        if( bomb.indexOf(number) >= 0 ){
            reassign(i);
        } else {
            bomb[i] = number;
        }   
    }

console.log(bomb);
}

function reassign(i) {

var number = Math.floor( Math.random() * 100 );
    if( bomb.indexOf(number) >=0)
    {
            reassign(i);
        } else {
            bomb[i] = number;
        }       
}

then when they click a box (td) it triggers the process function

function process(clicked) {
//change box look
clicked.style.backgroundColor = "#ffffff";
clicked.style.border = "1px solid black"; 
bombCheck(clicked);
}

which triggers the bombCheck()

bombCheck(event)
var boxNum = event.id;
function bombCheck(event) {
if ( bomb.indexOf(boxNum) >=0 ) {
    event.innerHTML = "B";
     alert("you clicked a bomb");
    }
}

the problem is the final indexof (the one in bombcheck) always returns -1 weather or not its a bomb (and i check which r bombs with console.log) as you can see i used a similar indexOf check earlier in the same script and it works just fine plz help me

You seem to be treating string as a number.. check answer below — woofmeow
– woofmeow, Commented Aug 15, 2013 at 4:43

woofmeow · Accepted Answer · 2013-08-15 04:42:14Z

4

It is because of this line

var boxNum = event.id; //this returns a STRING of the id attribute

Then you later treat use it as a number.

Instead of that line use this

var boxNum = parseInt(event.id); //this will return a NUMBER which you can use

answered Aug 15, 2013 at 4:42

woofmeow

2,41818 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Math chiller Over a year ago

thanks i knew about parseInt didnt know .id returned i number

woofmeow Over a year ago

Glad to have been of help. Best of luck with the game :)

Barmar Over a year ago

You probably shouldn't use numeric IDs to begin with. They weren't allowed in HTML4, and some browsers may not like them.

Math chiller Over a year ago

@Barmar atm i find numeric id's the most sensible for a loop especially since im using multiple loops (as you can see in my code) but if you have a good suggetion im all ears

Barmar Over a year ago

Use IDs like box1, box2, etc. Then var boxNum = parseInt(event.id.substr(3), 10);

|

Collectives™ on Stack Overflow

javascript array indexOf not working

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related