javascript - Using same onmouseover function for multiple objects -

I am creating a building game in javascript and php that contains grid. Each class in the grid has a div with its divouseover and onmousedown function:

 for  (x = 0; x  

However, all sections were added which looks to the X and Y of the previous class. I can see why this is happening - it's making an indicator on X and Y instead of cloning the variable - but how can I fix it? I also have to type (x = 0; x & lt; width = x ++) for

  {for (y = 0; y & lt; height; y ++) {var div = Document.createElement ("div"); Var myX = x; Var myY = y; Div.onmouseclick = function {blockClick (myX, myY)} div.onmouseover = function () {blockMouseover (myX, myY)} game.appendChild (div); }}  

with the same result.

I was using div.setAttribute ("onmouseover", ...) Firefox, but not IE!

You must close one to maintain the value of x and y . This should do the trick:

 for  (var x = 0; x & lt; width; x ++) {for (var y = 0; y & lt; height; y ++ ) {Var div = document .createElement ("div"); (X, y) {div.onmouseclick = function () {blockClick (x, y)} div.onmouseover = function () {blockMouseover (x, y)}}) (x, y); Game.appendChild (div); }}  

A cleaner way to do this is to define the function to create a div and then call it on each walk:

  var createDiv = Function (x, y) {var div = document.createElement ("div"); Div.onmouseclick = function () {blockClick (x, y)}; Div.onmouseover = function () {blockMouseover (x, y)}; Returns Diva; } For (var x = 0; x & lt; width; x ++) {for (var y = 0; y & lt; height; y ++) {game.appendChild (createDiv (x, y)); }}