将来自文本字段的输入与数组元素进行匹配

Question

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8">
      <title>Data search</title>
   </head>
   <body>
      <input type="text" name="" id="inputData" value="" placeholder="">
      <button type="button" onclick="myFunction()">search</button>
      <p id="text"></p>
      <script type="text/javascript">
         function myFunction(){
          var data = [1, 2, 3, 4, 5, "name", "email", "id", "password", "position"];
          var iData = document.getElementById("inputData").value;
         
          for(var i = 0; i <= data.length; i++){
             
              if(iData == data){
         
                  document.getElementById("text").innerHTML = "This data is available in array data";
              }else{
         
                   document.getElementById("text").innerHTML = "This data is not available in array data";
              }
          }
         }
      </script>
   </body>
</html>

我创建了一个包含一些数据的数组。我从文本字段中获取输入并根据数组中的数据搜索输入。如果输入的数据与数组中的元素匹配，我想显示一个通知，例如：

"This data is available in array data"

如果输入与数组中的任何元素都不匹配，我希望它输出：

"this data is not available in array data".

但它不起作用。我没有找到问题所在，我也不确定这是否是获得预期结果的正确方法。

Answer 1

您的代码中有两个错误 - 首先，当您在数组中找到数据时，您需要立即 return。否则你的函数将继续遍历元素并用 "This data is not available in array data".

再次覆盖正输出

其次，在你的比较中你需要使用 data[i] 而不是 data，因为你想测试数组中的每个元素，而不是整个数组本身。

这是一个活生生的例子：

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8">
      <title>Data search</title>
   </head>
   <body>
      <input type="text" name="" id="inputData" value="" placeholder="">
      <button type="button" onclick="myFunction()">search</button>
      <p id="text"></p>
      <script type="text/javascript">
         function myFunction(){
          var data = [1, 2, 3, 4, 5, "name", "email", "id", "password", "position"];
          var iData = document.getElementById("inputData").value;
         
          for(var i = 0; i <= data.length; i++){
             
              if(iData == data[i]){
         
                  document.getElementById("text").innerHTML = "This data is available in array data";
                  return;
              }else{
         
                   document.getElementById("text").innerHTML = "This data is not available in array data";
              }
          }
         }
      </script>
   </body>
</html>

将来自文本字段的输入与数组元素进行匹配

Matching input from a text field against elements of an array

javascript

arrays

html-input