jQuery: $(this) på insiden av $.get?

Sur og sarkastisk

22. august 2012

Hei, dette er sannsynligvis et ganske dumt spørsmål, og sikkert lett og finne ut av hvis man vet hva man skal google, og det gjør altså ikke jeg.

Jeg har da noe jQuery-kode jeg kunne sverget på at fungerte i går, men som jeg ikke får til å fungere i dag...
Koden er som følger:

Kode

	$(".wep").click(function() {
	
		val		=	$(this).attr('value');
		$.get('/admin/loopweps', { wep: val }, function(html) {
			wep	=	prompt(html, val);
			
			$(this).attr('value', wep);
			
			
		});
	});

Jeg vet at den får resultatet fra "loopweps", da det popper fint opp i prompt-boksen, det er når jeg prøver å bytte valuen på $(this) at det fucker seg opp...

Jeg har sålangt kommet fram til dette:
alert(val) både inni og utenfor $.get popper opp med riktig tall.
alert($(this).attr('value')) gir kun riktig resultat UTENFOR $.get.
alert($(this).attr('value')) inni $.get gir meg beskjeden undefined.

Ja, jeg er teit som ikke vet.

men kan noe VÆRE SÅ SNILL og hjelpe meg litt her, i hvert fall peke meg i riktig retning av hva man skal google, hittil har jeg prøvd ting som "jQuery this inside get", "jQuery this inside function" osv... men ingen av resultatene virker relevante.

Relevant HTML:

Kode

		<td><input type='text' name='wep1[<?=$foe['id']?>]' value='<?=$foe['wep1']?>' size='1' class='wep' /></td>
		<td><input type='text' name='wep2[<?=$foe['id']?>]' value='<?=$foe['wep2']?>' size='1' class='wep' /></td>

Så lenger nede:

Kode

		<td><input type='text' name='newwep1' size='1' class='wep' value='1' /></td>
		<td><input type='text' name='newwep2' size='1' class='wep'  value='1' /></td>

Løste det!

På en uelegant måte, men jeg kom ikke på noe bedre sååå... her er hva jeg gjorde:

Kode

$(".wep").click(function() {
	
		val		=	$(this).attr('value');
		id		=	$(this).attr('name');
		$.get('/admin/loopweps', { wep: val }, function(html) {
			wep	=	prompt(html, val);
			
			$("input[name='"+id+"']").attr('value', wep);
			
			
		});
	});

Ozma

55535 HP

3.680 1.125

22. august 2012

Trikset jeg bruker er å deklarere øverst i funksjonen.

Kode

$self = $(this);

og deretter bruke self istedenfor, i resten av funksjonen. På den måten er du sikker på at du refererer til objektet som blir klikket på, og ikke noen andre $(this), som eksisterer på innsiden av callback-funksjoner.

console.log(this) er forøvrig veldig nyttig.

Jannis!

207 73

22. august 2012

Samme som Ozma skriver, i din kode.

Kode

$(".wep").click(function() { 
      var $self = $(this);
        val        =    $self.attr('value'); 
        id        =    $self.attr('name'); 
        //$(this) her ute er .wep
        $.get('/admin/loopweps', { wep: val }, function(html) { 
            wep    =    prompt(html, val); 
             //$(this) her inne er et httpkall eller noe
            $self.attr('value', wep); 
             
             
        }); 
    });

Kaizen

685 142

22. august 2012

this refererer til den funsjonen du er inne i. Hver gang du bruker en jQuery komando ($) går du inn i en ny funksjon, og this peker da på denne nye funksjonen.

En løsning er å lagre referansen mens du er i funksjonen/objektet du ønsker å referere til.

var myRef = this;

Så bruker du myRef isteden for this der feilen oppstår.

Kaizen