javascript - 如何将输入值匹配到数组的整个范围？

Question

我正在编写一个测验，用户应该在其中填写答案，如果它与数组中的正确答案之一匹配，则该字段变为绿色，否则变为红色。这是有效的:

var arr = ["a", "b", "c"];
var id = document.getElementById("id");
 if (id.value == arr[0] 
     || id.value == arr[1] 
     || id.value == arr[2] 
     || id.value == arr[3]){id.style.backgroundColor = "#83C183";}
     else {id.style.backgroundColor = "#E06969";}

但我想摆脱:

 if (id.value == arr[0] || id.value == arr[1] || id.value == arr[2] || id.value == arr[3])

我尝试用 for 循环迭代数组:

 var arr = ["a", "b", "c"];
 var id = document.getElementById("id");
 for (var i = 0; i < arr.length; i++){ 
      if (id.value == arr[i]){id.style.backgroundColor = "#83C183";}
      else {id.style.backgroundColor = "#E06969";}
      }

但它只返回 "c" 为真。在这种情况下，如何选择数组中的所有项目？

Answer 1

您可以简单地使用indexOf 方法来检查答案是否存在于数组中。

var arr = ["a", "b", "c"];
var id = document.getElementById("id");
if(arr.indexOf(id.value) > -1)
 id.style.backgroundColor = "#83C183";
else  
 id.style.backgroundColor = "#E06969";