Hallo javascript guru's!

Ik ben een beetje met jQuery aan het leren omgaan.
Ik heb de volgende code:

getObject('xxx').focus(function(){
    if(getSpan('xxx').html() == '')
    {
        changeHtml('xxx', 'working');
    }
}).blur(function(){
    if(checkInput('xxx') == false)
    {
        changeHtml('xxx', 'error');
    }
}).keyup(function(){
    if(checkInput('xxx') == true)
    {
       changeHtml('xxx', 'correct');
    }
    else if(getSpan('xxx').hasClass('correct'))
    {
        changeHtml('xxx', 'error');
    }                    
});


deze code moet 5x worden uitgevoerd,elke keer met een andere tekst op de plaats van xxx.
Nu kan ik gewoon 5x hetzelfde code blok onder elkaar zetten en werkt het. Maar dat vind ik vrij achterlijk werk, hier zijn de loop voor bedacht!

Toen kwam ik op een volgende constructie:


velden = new Array('veld 1', 'veld 2');  // etc tm 5

for(veld in velden)
{
    name = velden[veld];
    getObject(name).focus(function(){
        if(getSpan(name).html() == '')
        {
            changeHtml(name, 'working');
        }
    }).blur(function(){
        if(checkInput(name) == false)
        {
            changeHtml(name, 'error');
        }
    }).keyup(function(){
        if(checkInput(name) == true)
        {
           changeHtml(name, 'correct');
        }
        else if(getSpan(name).hasClass('correct'))
        {
            changeHtml(name, 'error');
        }                    
    });                  
}


Helaas onthoudt hij op die manier alleen maar de laatste instantie.. alleen de functie's voor veld 5 werken dus. Hoe los ik dit op?

Gr
Je moet 'var' gebruiken voor je een variabele wilt maken. Anders ziet hij het als window.velden, window.veld en window.name, en die overschijf je dan dus constant. 'var' is Javascript's manier van een nieuwe variabele introduceren.

var velden = ['veld 1', 'veld 2'];

for(var veld in velden) {
    var name = velden[veld];
}


edit: inderdaad, wat hieronder staat. name wordt verbonden aan de scope van al je functies die je hier maakt, waardoor al die name variabelen naar hetzelfde stukje geheugen verwijzen, en ze dus alleen de laatste waarde uit de velden-array hebben.
name verwijst hier naar de variable 'name', en niet de waarde. (changeHtml).
Een oplossing is het maken van een functie waardoor name niet verandert:
var velden = new Array('veld 1', 'veld 2');  // etc tm 5
var dingesfunctie = function(name){
    getObject(name).focus(function(){
        if(getSpan(name).html() == '')
        {
            changeHtml(name, 'working');
        }
    }).blur(function(){
        if(checkInput(name) == false)
        {
            changeHtml(name, 'error');
        }
    }).keyup(function(){
        if(checkInput(name) == true)
        {
           changeHtml(name, 'correct');
        }
        else if(getSpan(name).hasClass('correct'))
        {
            changeHtml(name, 'error');
        }                    
    });
};
for(veld in velden)
{
    dingesfunctie(velden[veld]);
}


[size=xsmall]Toevoeging op 12/08/2010 15:21:28:[/size]

Jelmer rrrr op 12/08/2010 15:19:04

Je moet 'var' gebruiken voor je een variabele wilt maken. Anders ziet hij het als window.velden, window.veld en window.name, en die overschijf je dan dus constant. 'var' is Javascript's manier van een nieuwe variabele introduceren.

var velden = ['veld 1', 'veld 2'];

for(var veld in velden) {
    var name = velden[veld];
}



+1 voor de var, maar om de een of andere manier krijg ik bij sommige constructies het nog steeds niet werkend.
Dat heb ik ondervonden bij XMLHttpRequest.
Mijn laatst genoemde oplossing werkte wel.
Misschien niet helemaal overzichtelijk, maar het werkt :)

Reageren