getElementsByTagName negrīb īsti strādāt

[andrisp]

Ir Js, kas iterē cauri <li> elementiem, piekabina iekļautajam <a> elementam onmouseover un onmouseout, kas parāda vai paslēpj iekļauto <div>. Problēma tāda, ka error console saka thumb nav definēts.

 

Šeit kods:

http://paste.php.lv/4516

 

Kas par vainu ? Ko esmu palaidis garām ?

[Delfins]

Manuprāt loģiski, jo anonīmā f-ja nezin par nekādu mainīgo `i`...

 

link[i][0].mans_i = i;
link[i][0].onmouseover = function() {
	thumb[this.mans_i][0].style.display = 'block';
}

link[i][0].onmouseout = function() {
	thumb[this.mans_i][0].style.display = 'none';
}

Edited October 5, 2006 by Delfins

[andrisp]

Bet kāpēc tā redz thumb mainīgo ?

 

Itkā abas divas ir vienādi definētas (ar var) un atrodas vienā apgabalā (variable scope domāju). Vai arī tad, kad piesķīru jaunu vērtību thumb mainīgajam bez var, tad mainījās tā apgabals ?

Edited October 5, 2006 by andrisp

[Delfins]

doh!...

 

tāpēc, ka tā ir definēta dokumenta līmenī ar `var` direktīvu (tāpat kā php global $mans_kaks)

[andrisp]

Nu bet vai tad i netiek definēts dokumenta līmenī ?

 

Un cik lasīju, tad nav svarīgi vai dokumenta līmenī tiek definēts ar var vai bez, abejādi ir global.

 

Skatījos šeit: http://www.mredkj.com/tutorials/reference_js_intro_ex.html

[Delfins]

Tev ir taisnība, BET!!!!

 

1.) Kas tad tas mums te????

for (var i = 0; ....

A?

 

2.) Var noignorēt visu pārējo augstāk minēto, jo kā jau es teicu - anonīmā (statiskā) f-ja nezin par tekošo `i`, ja tu pats kaut kur viņu nenorādīsi

 

Pat ja tev `i` būs globāls... eventam i vienmēr būs kā pēdējais numurs un tas vairs nemainīsies... (ja neizmaina no koda)

[andrisp]

Ok, par to, ka i eventam būs pēdējos numurs es sapratu.

 

Bet vai tad javascriptā nav tikai divi apgabali ? 'Galvenais' un funkciju apgabali, nevis vēl for () ?

 

Enīvej, izlaboju pēc tava piemēra un tagad viss ir ok.

 

PS. Ko tu šodien tāds nervozāks nekā parasti ? :)

[Delfins]

Tavs `for` ir iekš f-jas

`i` ir definēts ar `var`

... so, `i` pieder f-jai.

... so no ārpuses neviens neko nezinās par tavu `i`, kas tika izmantots loop-ā

kā arī rakstot anonīmās f-jas - iekšā nekas netiek redzēts, jo tu pieškir referenci uz `pliko kodu`, tā neko neredz iekš tekošā scope, kas nav globāls

[andrisp]

Sit man nost, bet iekš kādas fjas tas for atrodas ? Nu nav taču. Ja nu vienīgi pats for nav kautkāda veida fjas paveids.

[Delfins]

ups... pārskatījos.. bet anyway, tas būtību nemaina par anonīmo f-ju un tekošo `i`

[andrisp]

Bet, piem., šis darbojas:

<input id="but" type="button" value="X" />

<script language="JavaScript" type="text/javascript">
var x = 'X!';

document.getElementById('but').onclick = function() {
alert(x);
}
</script>

Edited October 6, 2006 by andrisp

[Delfins]

Es nezinu, vai tas ir gļuks, bet kad lieto `i` iekš masīva, tad tas kaut kur pazūd...

 

var obj = document.getElementById('but_'+i).onclick = function() { code = "alert(arr[i]);"; alert('i = ' + typeof(i)); eval(code); }

 

kaut gan redz pēdējo `i`, bet arr =undefined

[andrisp]

Hm.. man gan strādā. Tagad es esmu pilnīgi apjucis, un nesaprotu kāpēc mans sākotnējais kods negrib strādāt.

var x = 2;
var arr = new Array();
arr[2] = 'test';
document.getElementById('but').onclick = function() {
alert(x);
alert(typeof arr);
alert(arr[x]);
}

[bubu]

1) nu tak Delfins #12 jau pateica: "redz pēdējo `i`"!. Ieleic tajā anonīmajā funkcijā alert(i), tad redzēsi brīnumus. i mainīgo šī funkcija redz kā globālu, tāpēc arī ņem globālā i vērtību, kas šajā gadījumā ir cikla garums 3. A bet masīvā (izdari alert(thumb)) ir taču tikai trīs elementi - ar indeksiem 0, 1, 2. Tāpēc arī neekstistē elements ar indeksu 3 un notiek errors (tu JS konsolē nepaskatījies)?

 

2) dīvainas lietas daries:

link = new Array(1);

...

link = list.getElementsByTagName('a');

piešķiram kautko un uzreiz pārrakstam citu kautko pa virsu..

 

3) es to visu būtu rakstījis kautkā šādi (globālie mainīgie taču ir īvili!! tāpēc jāizmanto klases memberi):

var L = list[i].getElementsByTagName('a')[0];
L.t = list[i].getElementsByTagName('div')[0];;

L.onmouseover = function() {
	this.t.style.display = 'block';
}

L.onmouseout = function() {
	this.t.style.display = 'none';
}

 

ja nu vajag ļoti saglabāt tos a un div elementus tajos globālajos masīvos, tad:

var link = [];
var thumb = [];

for (var i = 0; i < list.length; i++) {

var L = list[i].getElementsByTagName('a')[0];
var T = list[i].getElementsByTagName('div')[0];

link.push(L);
thumb.push(T);
L.t = T;

L.onmouseover = function() {
	this.t.style.display = 'block';
}

L.onmouseout = function() {
	this.t.style.display = 'none';
}

[andrisp]

Paldies, bubu, ka apskaidroji. Konsolē, protams, skatījos, bet nesapratu, ka vaina tur, ka neeksistējošs index. Man likās, ka fja neredz vispār to 'i'. Tagad man viss skaidrs.