[JavaScript]Functie met argument in addEvent binnen FOR loop

[Verwijderd]

Hey tweakers,

Een probleempje waar ik niet uit kom. Ik probeer een pagina te maken met 3 tabbladen. Als er op een tabblad geklikt wordt, dan moet de daarbij behorende pagina geladen worden.

Ik heb een array genaamd tabs waarin ik de tabs gestopt heb (h1 nodes). Met een for loop koppel ik aan iedere tab een onclick event om de functie switchTab aan te roepen met de parameter i. Deze parameter komt overeen met het nummer van de tab.

code:

for(i in tabs){
addEvent(tabs[i],"click",function(){switchTab(i)},false);
}

Ik heb echter de indruk dat iedere keer dat deze for-loop rond gegaan word, de anonimous functie overschreven wordt. Want ongeacht welke tab ik aanklik in mijn pagina hij springt altijd naar de laatste pagina/tabblad.

Heeft iemand een suggestie hoe ik dit kan omzeilen? Ik heb al gezocht op got en google, maar kan er niets over vinden.

In mijn tabs array zitten drie elementen, waardoor switchTabs altijd wordt aangeroepen met i =2

[Janoz]

De denkfout die je maakt is dat je denkt dat i niet meer veranderd op het moment dat je de functie definieert. Dat klopt niet. De gegenereerde functie heeft gewoon die i er nog in staan. Nadat de hele lus doorlopen is zit in i de laatste tab. Wanneer het event afgevuurd wordt wordt dus switchTab(i) aangeroepen waardoor naar de laatste tab geswitched wordt.

[crisp]

En als tabs een array is, waarom itereer je dan met een for-in met het risico dat je ook expando's meeneemt in je iteratie?

[Verwijderd]

Klinkt aannemelijk, maar hoe kan ik dit omzeilen.

Ik heb zojuist dit gevonden op:

code:

for (var i = 0; i < document.links.length; i++) {
    document.links[i].addEventListener('click', (function(n) {
        return function (e) {
            e.preventDefault();
            alert(n);
        };
    })(i), false);
}

Op http://userscripts.org/forums/1/topics/2713

Maar ben er nog niet uit hoe ik dit naar mijn hand kan zetten.

[Verwijderd]

@crisp, expando's zegt me niets, wellicht kan je het voor me op helderen.

[crisp]

Verwijderd schreef op maandag 21 juli 2008 @ 13:17:
@crisp, expando's zegt me niets, wellicht kan je het voor me op helderen.

JavaScript:

var a = [0,1,2];
Array.prototype.foo = 'expando';

for (var i in a)
    alert(i + ': ' + a[i]);

[crisp]

En voor wat betreft je probleem: je zal 'i' dus extra moeten scopen:

JavaScript:

addEvent(tabs[i], 'click', createTabClickHandler(i), false);

// ...

function createTabClickHandler(i)
{
  return function() { switchTab(i); }
}

kijk in elk geval eerst eens of je die 'i' ueberhaupt wel nodig hebt in je switchTab functie, immers is binnen die functie 'this' al een referentie naar je tabs[i] object (mits je een addEvent functie gebruikt die ook in IE de scope behoudt).

[Verwijderd]

Hey thnx...


Ik weet niet of ik dit helemaal snap, maar het werkt wel

[Verwijderd]

crisp schreef op maandag 21 juli 2008 @ 13:39:
[...]

JavaScript:

var a = [0,1,2];
Array.prototype.foo = 'expando';

for (var i in a)
    alert(i + ': ' + a[i]);

Da's dus een reden om het niet te doen. Zeker als je met meerdere mensen aan code werkt, moet je dus niet aan andermans prototypes gaan zitten, en al helemaal niet aan native objecten

Voor Array is het nog wel te doen, aangezien je nog met een teller kan doen (totdat iemand Array.prototype[0] = function(){} ergens in een lib stopt), maar voor een object is het imho van de zotte dat ik bij elke member moet gaan vragen of ik hem er wel zelf in heb gestopt.

[crisp]

Verwijderd schreef op maandag 21 juli 2008 @ 14:59:
[...]

Da's dus een reden om het niet te doen. Zeker als je met meerdere mensen aan code werkt, moet je dus niet aan andermans prototypes gaan zitten, en al helemaal niet aan native objecten

Voor Array is het nog wel te doen, aangezien je nog met een teller kan doen (totdat iemand Array.prototype[0] = function(){} ergens in een lib stopt), maar voor een object is het imho van de zotte dat ik bij elke member moet gaan vragen of ik hem er wel zelf in heb gestopt.

Voor Array is het gewoon noodzakelijk als je in oudere browsers ook bepaalde methods wilt kunnen gebruiken

Ik ben het met je eens dat je van Object af moet blijven though.

Het ging mij er om dat je for-in nooit voor een array moet gebruiken omdat, zoals je zelf al aangeeft, je daar gewoon numerieke indexen hebt (en als je dat niet hebt had je een object moeten gebruiken ipv een array)