Is there a reason this function doesn't work?

pmelan 0
Viewed 36

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);
    }
  })
})

dom arrays javascript
1 Answers

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";
}
Konstantin Savusia0
Related