Reputation: 1
I'm trying to make a wordle clone, and am stuck at this point where I have keyup functions, but when it identifies the enter key, it doesn't change the style of the tiles. Also note that each "row" is an object, and has keys in alphabetic order.
const colorChange = (word, row, letters) => {
for (let i = 0; i < letters.length - 1; i++) {
if (row.letters[i] === word[i]) {
row.letters[i].innerHTML.style.backgroundColor = "#618B55";
} else if (row.letters[i] === word[0], word[1], word[2], word[3], word[4]) {
row.letters[i].innerHTML.style.backgroundColor = "#B19F4C";
}
}
};
Array.from(inputs).forEach(function(inputs) {
inputs.addEventListener('keyup', function(event) {
if (event.keyCode <= 90 && event.keyCode >= 65 && inputs.value.length === 1) {
inputs.nextElementSibling.focus();
} else if (event.keyCode === 8) {
inputs.previousElementSibling.focus();
} else if (event.keyCode === 13) {
colorChange(word, row, letters);
}
})
})
Upvotes: -1
Views: 44
Reputation: 415
you have wrong else if
condition syntax
} else if (row.letters[i] === word[0], word[1], word[2], word[3], word[4]) {
row.letters[i].innerHTML.style.backgroundColor = "#B19F4C";
}
should be something like that
} else if ( [ word[0], word[1], word[2], word[3], word[4] ].includes(row.letters[i]) ) {
row.letters[i].innerHTML.style.backgroundColor = "#B19F4C";
}
Upvotes: 2