Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Multi funkcja bez deklaracji w zdarzeniu
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Rewil
Mam układ taki w htmlu:
  1. <div class="box_naglowek" id="box1" name="box_naglowek">
  2. <div class="box_naglowek" id="box2" name="box_naglowek">
  3. <div class="box_naglowek" id="box3" name="box_naglowek">

  1. window.onload = function() {
  2. document.getElementsByName("box_naglowek").ondblclick = function (){
  3. alert("bry");
  4. };
  5. }


Jak uzyskać że po dwukrotnym kliknieciu w konkretny box, wyświetli mi się jego konkretne id?
kamil4u
getElementsByName zwraca tablicę elementów. Zrób pętlę po elementach i dopiero wtedy przypisz zdarzenie(już konkretnym elementom).
Rewil
  1. window.onload = function() {
  2. for(var i=0;i < document.getElementsByName("box_naglowek").length;i++) {
  3. document.getElementsByName("box_naglowek").item(i).ondblclick = function (){
  4. alert("test boxa o id: "+i);
  5. };
  6. }

Rozwiązanie problemu.


Następny:
  1. <div class="box_zaw" id="box54">
  2. <div class="box_naglowek" name="box_naglowek">
  3. </div>
  4. </div>

Jak wyczytać id wcześniejszego diva, w którym się znajduje? Czy będzie konieczne przepisanie tego id?
kamil4u
Cytat
Rozwiązanie problemu.

Trochę jest niepoprawne, bo za każdym razem pobierasz wszystkie elementy i za każdym razem spr. ich długość. Umieść te dane w odpowiednich zmiennych lokalnych smile.gif

Kod
Następny

Poprzez drzewo DOM, a dokładniej: parentNode ( http://kurs.browsehappy.pl/JavaScript/DOM ) i później już tylko ".id", czyli
Kod
alert( el.parentNode.id )
, gdzie pod zmienną el, trzymasz <div class="box_naglowek" name="box_naglowek">
Rewil
Rozumiem już operacje na DOM'ie w JS'ie, ale mówisz że źle z tymi zmiennymi.

Z tego co zakładam tworzy kod po kolei(gdyby pętli nie było):

  1. window.onload = function() {
  2. var doc = document.getElementsByName("box_naglowek");
  3. doc.item(0).ondblclick = function (){
  4. alert("test boxa o id: "+doc.item(0).parentNode.id);
  5. };
  6. doc.item(1).ondblclick = function (){
  7. alert("test boxa o id: "+doc.item(1).parentNode.id);
  8. };
  9. doc.item(2).ondblclick = function (){
  10. alert("test boxa o id: "+doc.item(2).parentNode.id);
  11. };
  12. }


Ale po kliknięciu w nagłowek, pojawia się "2" o z tego faktu nie bardzo rozumiem.
Dzięki kamil4u, że mi pomagasz smile.gif
kamil4u
Znaczy teraz ja nie bardzo rozumie, dlatego napisze swój kod smile.gif
[JAVASCRIPT] pobierz, plaintext
  1. window.onload = function() {
  2. var i,els,len; //els -> elementy;len ->długość tablicy
  3. els = document.getElementsByName("box_naglowek");
  4. len = els.length;
  5. for(i=0; i < len; i++){
  6. document.getElementsByName("box_naglowek").item(i).ondblclick = function (){
  7. alert("test boxa o id: "+i);
  8. };
  9. }
  10.  
  11. //lub trochę inny sposób, ale taki taki bardziej użyteczny
  12.  
  13. window.onload = function() {
  14. var i,els,el; //els -> elementy; el ->konkretny element
  15. els = document.getElementsByName("box_naglowek");
  16. for(i=0; el = els[i]; i++){
  17. el.ondblclick = function (){
  18. alert("test boxa o id: "+i);
  19. };
  20. }
[JAVASCRIPT] pobierz, plaintext


I teraz uwaga, żebyś stosował tablica[i], a nie tablica.item(i) ,nie jest to błąd, ale większość programistów używa sposobu z nawiasami [ i ], to raz, a poza tym jest on krótszy i często czytelniejszy.

A o co chodzi z tym:
Cytat
Ale po kliknięciu w nagłowek, pojawia się "2" o z tego faktu nie bardzo rozumiem.

To ja nie rozumiem. Coś "źle" się wyświetla? Jak tak to podaj kod HTML(trochę bardziej obszerny) i kod JS i napisz co chcesz z niego uzyskać, wtedy sam będę mógł się pobawić i poszukać błędu smile.gif
Rewil
http://rewil.pctk.pl/sys/

Powiem ci że dokładnie otrzymaliśmy taki sam wynik i tobie id, i mi wyświetla to samo dla każdej ramki. smile.gif Więc znowu tak ze mną źle nie jest winksmiley.jpg
kamil4u
Nadal nie rozumiem co piszesz... - dałeś link, ale bez żadnego opisu... Skąd mam wiedzieć, o który fragment chodzi? Nie będę analizował całego Twojego kodu.

Cytat
Powiem ci że dokładnie otrzymaliśmy taki sam wynik

Z tym, że ten mój sposób(jeśli chodzi o pętlę for) jest lepszy, gdyż wykonuje dużo mniej operacji...

Ale przypomniało mi się, gdzie zrobiłem błąd... przyznam trochę głupi...
[JAVASCRIPT] pobierz, plaintext
  1. window.onload = function() {
  2. var i,els,len; //els -> elementy;len ->długość tablicy
  3. els = document.getElementsByName("box_naglowek");
  4. len = els.length;
  5. for(i=0; i < len; i++){
  6. document.getElementsByName("box_naglowek").item(i).ondblclick = function (i){
  7. return function(){
  8. alert("test boxa o id: "+i);
  9. };
  10. }(i);
  11. }
[JAVASCRIPT] pobierz, plaintext
Rewil
Tak to o to chodziło, próbowałem coś w tym stylu ale jeszcze tego nie ogarnąłem, dzięki przynajmniej się dużo nauczyłem smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.