Calling onclick with local variable

Question

First, apologies for asking something that must be answered here somewhere (I've been looking!)

I want to do this:

var i;
for (i = 0; i < 5; i++) {
  ...
  // Add an anchor to the dom
  ...
  a.onclick = goog.bind(this.doSomething, this);
  ...
}

namespace.Clazz.prototype.doSomething = function(event, index) {
  console.log('index: ' + index);
}

I want 5 anchors the each pass a different value for i to doSomething when clicked (along with the click event). I also want to keep the context of this in doSomething (hence the bind).

Niet the Dark Absol · Answer 1 · 2012-01-19T01:17:14.943

1

a.onclick = (function(i) { return function() {goog.bind.....}; })(i);

That creates a new closure in which the value of i is fixed.

edited Jan 19 '12 at 01:17

answered Jan 19 '12 at 00:57

Niet the Dark Absol

320,036
81
464
592

If I do: a.onclick = (function(i) { goog.bind(this.doSomething, this); })(i); a.onclick is ending up null... – Ben Flynn Jan 19 '12 at 01:16
There. The function(i) should return a function that becomes the onclick handler. – Niet the Dark Absol Jan 19 '12 at 01:17
Hmm, still having a little trouble. Since 'am not i am' has a solution that works with me, I'm going with that. Thanks for the help though! – Ben Flynn Jan 19 '12 at 01:22

score 1 · Accepted Answer · answered Jan 19 '12 at 01:13

If you can reverse the order that the arguments are received, you should be able to do this...

a.onclick = goog.bind(this.doSomething, this, i);

So your doSomething should look like this...

namespace.Clazz.prototype.doSomething = function(index, event) {
  console.log('index: ' + index);
};

At least that's how it looks from the Google Closure Library source.

score 0 · Answer 3 · answered Jan 19 '12 at 00:58

0

Something like this may work better for you:

a.onclick = function() {
    doSomething(this, i)
}

answered Jan 19 '12 at 00:58

SpoonNZ

3,780
1
20
25

The value of `i` will change, though, as the loop continues. – Niet the Dark Absol Jan 19 '12 at 01:00

Calling onclick with local variable

3 Answers3

Linked