Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Dziwna sprawa z innerHTML
cve
post 21.12.2009, 16:44:20
Post #1





Grupa: Zarejestrowani
Postów: 25
Pomógł: 0
Dołączył: 18.09.2009

Ostrzeżenie: (0%)
-----


Witam posiadam następujące pliki:

index.hml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="pl">
  5.  
  6. <title>An XHTML 1.0 Strict standard template</title>
  7. <meta http-equiv="content-type"
  8. content="text/html;charset=utf-8" />
  9. <meta http-equiv="Content-Style-Type" content="text/css" />
  10. <script type="text/javascript" src="prepJSfuncs.js"></script>
  11. <script type="text/javascript" src="javascript.js"></script>
  12. <link href="style.css" rel="stylesheet" media="all" />
  13. </head>
  14.  
  15.  
  16. <div class="item">1</div>
  17. <div class="item">2</div>
  18. <div class="item">3</div>
  19. <div class="item">4</div>
  20. <div class="item">5</div>
  21. <div class="item">6</div>
  22.  
  23. </body>
  24. </html>


prepJSfuncs.js:

  1. function addEvent(odnosnik, zdarzenie, funkcja)
  2. {
  3. if (odnosnik.addEventListener)
  4. {
  5. odnosnik.addEventListener(zdarzenie, funkcja, false);
  6. }
  7. else
  8. {
  9. odnosnik.attachEvent("on"+zdarzenie, funkcja);
  10. }
  11. }
  12. function getElById( id )
  13. {
  14. return document.getElementById( id );
  15. }
  16.  
  17. function getElByClassName (cl) {
  18. var retnode = [];
  19. var myclass = new RegExp('\\b'+cl+'\\b');
  20. var elem = document.getElementsByTagName('*');
  21. for (var i = 0; i < elem.length; i++) {
  22. var classes = elem[i].className;
  23. if (myclass.test(classes)) retnode.push(elem[i]);
  24. }
  25. return retnode;
  26. }


javascript.js
  1. addEvent(window, 'load', start);
  2. function start() {
  3.  
  4. divItems = getElByClassName('item');
  5. divsText = new Array();
  6. for(i in divItems) {
  7. divsText[i] = divItems[i].innerHTML;
  8. }
  9. for(i in divItems) {
  10. addEvent(divItems[i], 'mouseover', function () { this.innerHTML = 'Najechano' });
  11. addEvent(divItems[i], 'mouseout', function () { this.innerHTML = divsText[i]; });
  12. }
  13. }


a problem polega na tym, ze gdy najadę na jakikolwiek div to wszystko jest ok, pokazuje się w jego zawartosci 'Najechano', ale gdy zjadę kursorem z któregokolwiek diva to przypisuje mu zawartosc '6'? jak to sie dzieje? nie mam pojęcia...? przed wywolaniem addEvent w petli alert(divsText[i]); w petli pokazuje ladnie kolejne 1, 2, 3, 4, 5, 6, wiec nie mam zielonego pojecia dlaczego nie chce wybrac z tablicy odpowiedniego elementu tylko caly czas ostatni... ktorego wartoscia jest '6';
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 1)
ziqzaq
post 22.12.2009, 09:03:11
Post #2





Grupa: Zarejestrowani
Postów: 428
Pomógł: 128
Dołączył: 17.06.2007

Ostrzeżenie: (0%)
-----


Witam.
Zmienna "i" nie jest przekazywana do anonimowej funkcji wykonywanej podczas zdarzeń "onmouseover|out". W tej funkcji odwołujesz się do zmiennej "i", która występuje w "for".
Zrób sobie prosty test i spróbuj się domyślić co teraz będzie wstawiane w div-y:
[JAVASCRIPT] pobierz, plaintext
  1. for (i in divItems) {
  2. // kod
  3. }
  4. i = 0;
[JAVASCRIPT] pobierz, plaintext

Jeśli chodzi o przekazywanie parametrów to spróbuj partial.
Przykład użycia:
[JAVASCRIPT] pobierz, plaintext
  1. addEvent(el, 'onmouseover', partial(przykladowaFunkcja, el, 'przykladowy tekst mouseover'));
  2. function przykladowaFunkcja(el, txt) {
  3. el.innerHTML = txt;
  4. }
[JAVASCRIPT] pobierz, plaintext

Pozdrawiam
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 01:12