Question

I have two html tables. All cell values are being changed by interval in 3 seconds.
And also when a cell changes it sets background colour of it according to the cell value which was set in previous cycle. In the mean time a settimeout function is being set to the cells to reset colour of background after 2 seconds.

My problem is every 2 seconds I need to reset colour of the cells but
the setTimeout functions are only working for the last cell.

Note:
In my application every cell is being changed its own cycle so resetting colour of cells must be working for its owner (cell). Not in the same time.

I have created an example in JsFiddle . Can anyone help me?

Answer 1

This is a classical “closure in loop” issue. You already tried to create another inner closure to include the local context but you missed the parameters (and used == to assign instead of compare)

EDIT: Next time please include your code inside the post and not only in a jsfiddle so that this post can stand for itself without the external reference

            _cellColorTimeouts[obj] = setTimeout((function(_cell, _obj) {
                return function() {
                    debugger;
                    _cell.css({
                        "background-color":"white",
                        "color":"black"
                    });

                    _cellColorTimeouts[_obj] = null;
                    clearTimeout(_cellColorTimeouts[_obj]);
                };
            })(cell,obj), 2000);

EDIT3: See this fiddle: http://jsfiddle.net/7FXtL/10/