Poczatki z js


(Konradnie1) #1

Witam ucze sie js (W zasadzie to sie bawie uczac) i mam taki kod:

function spr()

{ 

obj=document.getElementById("podloga"); 

obji=document.getElementById("img");       

imgcur=document.getElementById("podloga");    

imgcuri=document.getElementById("img");     

if(findleft(obj)==findleft(obji) && findtop(obj)==findtop(obji)){alert("Blad");document.location.reload();}; 

}

Wywołuje go tak: setInterval("spr()",150); tylko że on nie działa jeśli jest == jak dam <= albo >= to działa. czy ktoś wie dlaczego??

Chce zrobić tak że jak 2 img są na tym samym miejscu to wyskoczy alert


(Pablo_Wawa) #2
  1. Na tym forum piszemy po polsku (używamy polskich “ogonków”) - Ciebie też to dotyczy.

  2. Nie wiem po co masz zdublowany kod (obj to to samo co imgcur, analogicznie obji i imgcuri).

  3. Nie znamy dokładnej zawartości funkcji findleft() i findtop() - możemy się tylko domyślać, co one robią - ale jeśli tam jest jakiś błąd?

  4. Ponieważ używasz zwykłej równości, to musisz pamiętać, żeby dopasować położenie obu elementów/obrazków co do piksela - różnica 1px może być często niezauważalna, a kod się nie wykona, bo równość nie będzie spełniona.


(Konradnie1) #3
  1. funkcje findtop i findleft:

    function findtop(obj) {

     var ntop = 0;
    
     if (obj.offsetParent){
    
         ntop = obj.offsetTop
    
         while (obj = obj.offsetParent) {
    
             ntop += obj.offsetTop
    
         }
    
     }
    
     return [ntop];
    

    }

           function findleft(obj) {           
    
     var nleft = 0;
    
     if (obj.offsetParent){
    
         nleft = obj.offsetLeft
    
         while (obj = obj.offsetParent) {
    
             nleft += obj.offsetLeft
    
         }
    
     }
    
     return [nleft];
    

    }

  2. Oba obrazki są 50x50 Jeden jest na stałe a drugi jest ruchomy:

    function rysuj()

    {

    obj=document.getElementById(“podloga”);

    imgcur=document.getElementById(“podloga”);

    if(findleft(obj)>400){document.getElementById(“podloga”).style.left=imgcur.offsetLeft-10+“px”;}else{document.getElementById(“podloga”).style.left=500};

    }

    setInterval(“rysuj()”,150);

i chce zrobić tak że jak sie nałożą to wyskoczy blad(Wiem tu też zdublowałem kod)


(Pablo_Wawa) #4

Wywal te nawiasy kwadratowe z returnów - zamiast return [ntop]; użyj return ntop; i analogicznie dla _nlef_t.


(Konradnie1) #5

Dzięki. Już działa. Dlaczego nie działało z []?? przecież po obu stronach było [cos] == [cos] to powinno działać czy ja źle rozumiem??

teraz jest błąd jak obrazki się nałożą a da sie zrobić żeby wyswietliło błąd jesli na siebie najdzie troszke??


(Pablo_Wawa) #6

Konstrukcja [x] to tablica zawierająca element x - konstrukcja np. przydatna jak się chce zwrócić w funkcji więcej niż jeden element - return [x,y,z]; zwróci tablicę 3-elementową.

U Ciebie nie ma takiej potrzeby, stąd nawiasy [] są zbędne. Ale nie tylko są zbędne - powodowały błędne działanie porównania. Otóż porównywać na “==” można m.in. liczby lub napisy - i to ma sens. Ale nie można w JS tym operatorem (sensownie) porównywać innych elementów, np. tablic czy obiektów, bo dwie tablice muszą być tym samym elementem (zmienną), by były równe. Sprawdź sobie taką konstrukcję:

alert([1] == [1]);

Wiesz co będzie wynikiem? FALSE!. Bo obie tablice, mimo iż zawierają tą samą wartość, są dwiema osobnymi elementmi (bytami), więc nie są sobie równe. Za to taki kod

var x = [1];

var y = x;

alert(x == y);

wyświetli TRUE.


(Brightophidia) #7

W JavaScript tablica jest obiektem porównując dwa obiekty porównujesz ich referencje. Twój zapis oznaczał porównanie dwóch róznych referencji, natomiast gdy porównujesz wartości wszystko jest ok.

Ponadto gdy przypisujesz coś do obiektu to przypsujesz referencje czyli np zapis:

a = [1];

b = a; // zarówno a[0] i b[0] są równe 1

b[0] = 2 // zarowno a[0] jak i b[0] są równe 2

(dobrygosc) #8

W Strefie Kursów jest dobry kurs video z programowania w JS. Z jego pomocą można spokojnie przejść z podstaw do poziomu. Piszę o tym bo sam się z tego uczyłem:)