Question

我想编写一个程序，该程序可以从字符串的用户输入中读取值，并可以验证该字符串是否与任何数组匹配。如果匹配，则程序将在HTML标记

中返回该字符串。

我已经声明了一个名为“ cars”的数组，并创建了一个循环，该循环将检查该数组的每个单独值。每次我得到字符串“不可用”。

<html>
    <head>
        <title>Check Whether it is present or not</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="Design.css" />
    </head>
    <body>        
        <div>
            <input type="text" id="txt">
            <input type="button" value="Check" id="btn">
        </div>
        <div>
            <p id="para">para</p>
        </div>
        <script src="Soul.js"></script>
    </body>
</html>



function check() {

    let intText = document.getElementById("txt").value;
    let cars = ["Lamborghini", "BMW", "Ferrari"];

    for (let i = 0; i < cars.length; i++) {
        if (intText == cars[i]) {
            return document.getElementById("para").innerHTML = cars[i] + " is present";
        }
        else {
            return document.getElementById("para").innerHTML = "Not Available";
        } 
    }
    return cars;
}

btn.addEventListener('click', check, false);

如果用户输入BMW，则必须返回“存在BMW” 同样，兰博基尼必须返回“存在兰博基尼” 但布加迪必须返回“不存在”

Answer 1

除非需要，否则不要使用循环

    function check() {

        let intText = document.getElementById("txt").value;
        let cars = ["Lamborghini", "BMW", "Ferrari"];
        if(cars.includes(intText)){
        document.getElementById("para").innerHTML =intText + " is present";
        } else {
        document.getElementById("para").innerHTML = "Not Available";
        }   
    }

    btn.addEventListener('click', check, false);

        <head>
            <title>Check Whether it is present or not</title>
            <meta charset="utf-8">
            <link rel="stylesheet" href="Design.css" />
        </head>
        <body>        
            <div>
                <input type="text" id="txt">
                <input type="button" value="Check" id="btn">
            </div>
            <div>
                <p id="para">para</p>
            </div>
            <script src="Soul.js"></script>
        </body>
    </html>

Answer 2

只需使用include在数组中查找匹配项即可。不需要for循环。

cars.includes(intText)
let intText = document.getElementById("txt").value;
let cars = ["Lamborghini", "BMW", "Ferrari"];

function check() {

    let intText = document.getElementById("txt").value;
    let cars = ["Lamborghini", "BMW", "Ferrari"];

    if(cars.includes(intText)){
      return document.getElementById("para").innerHTML = intText + " is present";
      }
      else {
         return document.getElementById("para").innerHTML = "Not Available"
       }
}

btn.addEventListener('click', check, false);

<html>
    <head>
        <title>Check Whether it is present or not</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="Design.css" />
    </head>
    <body>        
        <div>
            <input type="text" id="txt">
            <input type="button" value="Check" id="btn">
        </div>
        <div>
            <p id="para">para</p>
        </div>
        <script src="Soul.js"></script>
    </body>
</html>

Answer 3

您可以通过简单的条件来实现：

var input = "BMW";
var input2 = "Peugeot"


function checkCar(car){
   var cars = ["BMW", "Lambo", "Bugatti"];
   if(!!~cars.indexOf(car)){
      return car+" is present";
   }
   return car+" not present";
}

console.log(checkCar(input));
console.log(checkCar(input2));

关键是!!~cars.indexOf(car)的公式，如果该值在数组中（并且也适用于字符串），则仅返回true

Answer 4

 <html>
    <head>
        <title>Check Whether it is present or not</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="Design.css" />
    </head>
    <body>        
        <div>
            <input type="text" id="txt">
            <input type="button" value="Check" id="btn">
        </div>
        <div>
            <p id="para">para</p>
        </div>
        <script src="Soul.js"></script>
    </body>
</html>

<script>

function check() {

    let intText = document.getElementById("txt").value;
    let btn = document.getElementById("btn");
    let cars = ["Lamborghini", "BMW", "Ferrari"];

    let text = "Not Available";
    for (let i = 0; i < cars.length; i++) {
        let car = cars[i];
        if (intText == car) {
            text = car;
            break;
        }
    }
    document.getElementById("para").innerHTML = text + " is present";
}

btn.addEventListener('click', check, false);

</script>

匹配时应该中断循环。

Answer 5

function check() {
    document.getElementById("para").innerHTML = "";
    let intText = document.getElementById("txt").value;
    let cars = ["Lamborghini", "BMW", "Ferrari"];
    var flag=cars.indexOf(intText);
    if (flag>-1)return document.getElementById("para").innerHTML =intText + " is present";
    else return document.getElementById("para").innerHTML = "Not Available";
 }
btn.addEventListener('click', check, false);

<html>
    <head>
        <title>Check Whether it is present or not</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="Design.css" />
    </head>
    <body>        
        <div>
            <input type="text" id="txt">
            <input type="button" value="Check" id="btn">
        </div>
        <div>
            <p id="para"/>
        </div>
        <script src="Soul.js"></script>
    </body>
</html>

Answer 6

function check() {

  let intText = document.getElementById("txt").value;
  let cars = ["Lamborghini", "BMW", "Ferrari"];

  if (cars.indexOf(intText) !== -1) {
    return document.getElementById("para").innerHTML = intText + " is present";
  } else {
    return document.getElementById("para").innerHTML = "Not Available";
  }

  return cars;
}

btn.addEventListener('click', check, false);

<html>

<head>
  <title>Check Whether it is present or not</title>
  <meta charset="utf-8">
  <link rel="stylesheet" href="Design.css" />
</head>

<body>
  <div>
    <input type="text" id="txt">
    <input type="button" value="Check" id="btn">
  </div>
  <div>
    <p id="para"></p>
  </div>
  <script src="Soul.js"></script>
</body>

</html>

如何通过输入值检查数组值？

6 个答案: