javascript - 将输入与数组的值进行比较仅适用于单个值

Question

我有一些水果名称存储在数组中。如果用户输入的食物名称已存储在数组中，则应返回 true，否则返回 false。

但是当我输入值Mango时它只返回true，否则总是返回false，为什么？

这是我的代码:

JSfiddle link

HTML:

<input type="text" id="value" />
<button onclick="check()">test</button>
<p id="pValue">
</p>

JavaScript:

var myVar;

check = function() {
    myVar = document.getElementById("value").value;

    var fruits = ['Banana', 'Orange', 'Apple', 'Mango'];

    for(i = 0; i < fruits.length; i++) {
        if(myVar == fruits[i]) {
            document.getElementById("pValue").innerHTML = "true";
        }
        else {
            document.getElementById("pValue").innerHTML = "false";
        }
    }
}

Answer 1

这是因为您使用的是 for 增量循环，因此只有最后一个值才会返回 true。如果您选择将其保留为方法，则可以将 break; 添加到循环中。请参阅下面更新的 fiddle ::

var myVar;


check = function() {
    myVar = document.getElementById("value").value;
    var fruits = ['Banana', 'Orange', 'Apple', 'Mango'];

    for (i = 0; i < fruits.length; i++) {
        if (myVar == fruits[i]) {
            document.getElementById("pValue").innerHTML = "true";
            break;
        } else {
            document.getElementById("pValue").innerHTML = "false";
        }
    }
}

<input type="text" id="value" />
<button onclick="check()">test</button>
<p id="pValue">
</p>