This is a very beginner question but I've tried searching for answers and can't find anything. Would appreciate any insight. I know how to get the code to work because I've seen an example with better/proper code. My question is why MY code won't work (even if it's not optimal, I don't understand why it doesn't at least work). It works when I plug it into the console but not when I open the page.
So the program is just a simple Scorekeeper. The buttons are supposed to disable when "play until" score is hit by either player so the game has to be reset to work again. But even when I check the booleans in console and they're returning true and the If Statement runs, it still doesn't work on the page. The button's don't disable.
ex. if winningScore is 5 and scoreOne.innerText is '5' and I put in winningScore === parseInt(scoreOne.innerText) when they're the same number the If Statement actually runs in console.
The code (not sure if I should post the whole thing or cut out the seemingly irrelevant parts):
const scoreOne = document.querySelector('#scoreOne');
const scoreTwo = document.querySelector('#scoreTwo');
const scoreOneUp = document.querySelector('#scoreOneUp');
const scoreOneDown = document.querySelector('#scoreOneDown');
const scoreTwoUp = document.querySelector('#scoreTwoUp');
const scoreTwoDown = document.querySelector('#scoreTwoDown');
const reset = document.querySelector('#reset');
const points = document.querySelector('#points');
let winningScore = 3;
points.addEventListener('change', function() {
winningScore = parseInt(this.value);
});
//this code here !!!! doesn't run
if (winningScore == parseInt(scoreOne.innerText)) {
scoreOne.style.color = 'green';
scoreTwo.style.color = 'red';
scoreOneUp.disabled = true;
scoreTwoUp.disabled = true;
scoreOneDown.disabled = true;
scoreTwoDown.disabled = true;
} else if (winningScore == parseInt(scoreTwo.innerText)) {
scoresTwo.style.color = 'green';
scoresOne.style.color = 'red';
scoreOneUp.disabled = true;
scoreTwoUp.disabled = true;
scoreOneDown.disabled = true;
scoreTwoDown.disabled = true;
}
scoreOneUp.addEventListener('click', function() {
scoreOne.innerText = parseInt(scoreOne.innerText) + 1;
});
scoreOneDown.addEventListener('click', function() {
if (parseInt(scoreOne.innerText) > 0) {
scoreOne.innerText = parseInt(scoreOne.innerText) - 1;}
});
scoreTwoUp.addEventListener('click', function() {
scoreTwo.innerText = parseInt(scoreTwo.innerText) + 1;
});
scoreTwoDown.addEventListener('click', function() {
if (parseInt(scoreTwo.innerText) > 0) {
scoreTwo.innerText = parseInt(scoreTwo.innerText) - 1;}
});
reset.addEventListener('click', function() {
scoreOne.innerText = 0;
scoreTwo.innerText = 0;
scoreOneUp.disabled = false;
scoreOneDown.disabled = false;
scoreTwoUp.disabled = false;
scoreTwoDown.disabled = false;
});
Thank you in advance.
Aucun commentaire:
Enregistrer un commentaire