Quantcast
Channel: Forum Pasja Informatyki - Najnowsze pytania bez odpowiedzi
Viewing all articles
Browse latest Browse all 21942

Porównanie pary klas css w js

$
0
0

Witam po dłuższej przerwie,

spędziłem już trochę czasu nad moim problemem, więc zwracam się do was o pomoc.

Mam dwie metody. Jedna pobiera wszystkie obiekty z klasą "no-clicked", po kliknięciu na obiekt z tą klasą dodaje do array. Po drugim kliknięciu na następny obiekt, metoda guessPair porównuje zawartość klikniętych obiektów.

Gdy są takie same, usuwa klasy "no-clicked" dodaje "clicked". Gdy nie są takie same, klasy zostawia bez zmian. Zabawa zaczyna się od początku z pozostałymi obiektami.

Nic skomplikowanego, a jednak.

Wszystko działa do pierwszej zgadniętej pary. Później wolna amerykanka i błędy: Uncaught TypeError: Cannot read property 'classList' of undefined.

    parseClick: function() {
        var characters = document.getElementsByClassName("no-clicked"),
            arrPair = new Array(0),
            arrCharacterLenght = characters.length,
            clickSound = document.getElementById("soundClick"),
            j = 0;
        if (arrCharacterLenght === 0) {
            setTimeout(view.congratulations, 2100);
        } else {

          function clickCheck(i) {
            characters[i].addEventListener("click", function() {
                var clickedCharacter = characters[i];
                console.log("klikniety "+clickedCharacter+" numer "+i);
                clickedCharacter.classList.add("clicked");
                j++;
                view.showUp(clickedCharacter);
                view.soundClick(clickSound);
                arrPair.push(clickedCharacter);
                if (j === 2) {
                    contnroller.guessPair(arrPair);
                    j = 0;
                    arrPair.length = 0;
                }
            }, false)
          };

        for (var i = 0; i < arrCharacterLenght; i++) {
          clickCheck(i);
        }
    }
  },
    guessPair: function(pair) {
        var firstLetter = pair[0].getElementsByTagName("p")[0].innerHTML,
            secondLetter = pair[1].getElementsByTagName("p")[0].innerHTML;
        if (firstLetter === secondLetter) {
            pair[0].classList.remove("no-clicked");
            pair[1].classList.remove("no-clicked");
            view.hit();
            contnroller.parseClick();
        } else {
            pair[0].classList.remove("clicked");
            pair[1].classList.remove("clicked");
            view.backHide(pair);
            view.miss();
        }
    },
}

Dzięki za pomoc.

 


Viewing all articles
Browse latest Browse all 21942