Problem z prostą grą w przeglądarce (zgadnij liczbę)

Rejestracja:ponad 5 lat
Ostatnio:ponad rok
Postów:74

Witam
Napisałem taki kod, patrzyłem się na niego z pół godziny i nijak nie udało mi się zrozumieć w czym tkwi problem. Otóż odpalany jest zawsze pierwszy warunek mimo, że pozostałe warunki są poprawnie napisane. Według mnie skrypt wygląda okej.

W dodatku po załadowaniu strony Od razu widać napis "Brak cyfry", a powinien się pojawić dopiero po kliknięciu na 'Check'

To
powinno wywołać funkcję OnClickFunc a ta z kolei wywołuje dane zapisane w zmiennej.

screenshot-20220327181342.png (125 KB) - ściągnięć: 29
screenshot-20220327181701.png (5 KB) - ściągnięć: 8

Xarviel 2022-03-27 17:16

Wstawiając kod jako obrazek sprawiasz, że trudniej Ci pomóc, bo nie mogę go skopiować i pokazać Ci, który fragment jest zły (Formatowanie artykułów i komentarzy)

Lobos91

2022-03-27 17:26

Lobos912022-03-27 17:26

Rejestracja:ponad 5 lat
Ostatnio:ponad rok
Postów:74

A sorrki, daje kod

Kopiuj

'use strict';

// Cyfra którą wpisujemy do okienka
const guess = Number(document.querySelector('.guess').value);

// funkcja zapisana w zmiennej która wyświetla text w
// odpowiednio zdefiniowanym miejscu na stronce.
let message = function(text) {
    document.querySelector('.message').textContent = text
}

// losowa liczba
let secretNumber = Math.floor(Math.random() * 20) + 1;


function OnClickFunc() {
    if (!guess) {
        message('Brak cyfry!');
        document.querySelector('.message').style.color = 'red';
    }
    else if (guess > secretNumber){
        message('Too high!');
    }
    else if (guess < secretNumber){
        message('Too low!');
    }
    else {
        message('👏😜 You guessed right!');
        document.querySelector('.message').style.backgroundColor =
        'blue';
    }
};

document.querySelector('.check').addEventListener('click', OnClickFunc())
console.log('secret number is ' + secretNumber)

LukeJL

2022-03-27 17:44

LukeJL2022-03-27 17:44

Rejestracja:około 11 lat
Ostatnio:około 2 godziny
Postów:8422

Kopiuj

const guess = Number(document.querySelector('.guess').value);

to się odpali raz na początku, więc nic dziwnego, że tam nic nie masz. Powinieneś ustawiać tę zmienną dopiero jak użytkownik zmieni to pole tekstowe.

W dodatku po załadowaniu strony Od razu widać napis "Brak cyfry", a powinien się pojawić dopiero po kliknięciu na 'Check'

Ponieważ sam uruchamiasz tę funkcję:

Kopiuj

document.querySelector('.check').addEventListener('click', OnClickFunc())

jeśli dajesz OnClickFunc(), to się odpala funkcja. Powinieneś dać OnClickFunc (bez nawiasów), wtedy nie wywołujesz funkcji, tylko przekazujesz referencję do funkcji OnClickFunc.

edytowany 1x, ostatnio: LukeJL 2022-03-27 17:45