Question

function start() {
    var arrNums = [18,23,20,17,21,18,22,19,18,20];
    var searchValue, index, result;
    searchValue = Number(document.getElementById("searchValue").value);
    index = 0;
    result = " ";
    document.getElementById("msg").innerHTML+="The values in the array are: ";
    while(index < arrNums.length) {

        document.getElementById("msg").innerHTML+= arrNums[index] + " ";
        index++;
    }

    index = 0;

    while (index < arrNums.length) {
        if (arrNums[index] == searchValue) {
            document.getElementById("msg").innerHTML+= "The number" + result + " exists in the array";
            document.getElementById("msg").innerHTML+= "The values in this example do match the vaules you must use.";
        } else {
            document.getElementById("msg").innerHTML+= "The number" + result + " does not exist in the array";
            document.getElementById("msg").innerHTML+= "The values in this example do not match the vaules you must use.";
        }
        index++;
    }
}


function clearOutput() {
    document.getElementById("msg").innerHTML=" ";
}

当我运行代码时，我可以得到“数组中的值是：”，所有数字都打印出来，然后下一部分重复“其他”约10次。我该如何解决这个问题，谢谢

Answer 1

第二个while不执行任何操作，因为变量index在第一个while循环的每次迭代后递增。您需要在第二个index之前重置while计数器。

while(index < arrNums.length) {

    document.getElementById("msg").innerHTML+= arrNums[index] + " ";
    index++;
}

index = 0;

while (index < arrNums.length) {
    if (arrNums[index] == searchValue) {
        document.getElementById("msg").innerHTML+= "The number" + result + " exists in the array";
        document.getElementById("msg").innerHTML+= "The values in this example do match the vaules you must use.";
    } else {
        document.getElementById("msg").innerHTML+= "The number" + result + " does not exist in the array";
        document.getElementById("msg").innerHTML+= "The values in this example do not match the vaules you must use.";
    }
    index++;
}

更改问题后的更新

＆＃39; IF＆＃39; jQuery是一个选项，您可以使用inArray函数，它将返回＆＃34;找到＆＃34;的索引。数组中的元素或-1，如果＆＃34;未找到＆＃34;。

例如，代替您的第二个while循环：

var isFoundAtPosition = jQuery.inArray(Number(searchValue), arrNums);
if(isFoundAtPosition > -1) {
    document.getElementById("msg").innerHTML+="The number " + searchValue + " exists in the array at position " + isFoundAtPosition;
}
else {
    document.getElementById("msg").innerHTML+= "The number" + searchValue + " does not exist in the array";
}

而且，如果jQuery不是一个选项，你可以通过以下Javascript实现相同的结果：

index = 0;
var numberFound = false;
while (index < arrNums.length) {
    if (arrNums[index] == searchValue) {
        numberFound = true;
        break;
    } 
    index++;
}
if(numberFound) {
   document.getElementById("msg").innerHTML+="The number " + searchValue + " exists in the array at position " + index;
}

编辑2

好的，我做了一些例子（一个使用Javascript，一个使用jQuery）。希望这些将有所帮助：

<强>的Javascript

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>

<body>
  <input type="text" onchange="valueChanged(this.value)" id="searchValue">
  <div id="msg"></div>
</body>

</html>
<script>
  function valueChanged(searchValue) {
    var arrNums = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];
    var index = 0;
    document.getElementById("msg").innerHTML += "Values in the array are: ";
    while (index < arrNums.length) {
      document.getElementById("msg").innerHTML += arrNums[index] + " ";
      index++;
    }
    index = 0;
    var numberFound = false;
    while (index < arrNums.length) {
    console.log(searchValue, arrNums[index])
      if (arrNums[index] == searchValue) {
        alert("Number found");
        numberFound = true;
        break;
      }
      index++;
    }
    if (numberFound) {
      document.getElementById("msg").innerHTML = "The number " + searchValue + " exists";
    }
  }
</script>

＆＃13;

<强>的jQuery

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>

<body>
  <input type="text" onchange="valueChanged(this.value)" id="searchValue">
  <div id="msg"></div>
</body>

</html>
<script>
  function valueChanged(searchValue) {
    var arrNums = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];
    var index = 0;
    document.getElementById("msg").innerHTML += "Values in the array are: ";
    while (index < arrNums.length) {
      document.getElementById("msg").innerHTML += arrNums[index] + " ";
      index++;
    }
    var isFoundAtPosition = jQuery.inArray(Number(searchValue), arrNums);
    console.log(isFoundAtPosition);
    if (isFoundAtPosition > -1) {
      document.getElementById("msg").innerHTML += "The number " + searchValue + " exists in the array at position " + isFoundAtPosition;
    } else {
      document.getElementById("msg").innerHTML += "The number" + searchValue + " does not exist in the array";
    }
  }
</script>

＆＃13;

Answer 2

function start() {
    var arrNums = [18,23,20,17,21,18,22,19,18,20];
    var searchValue, index, result, found; // found flag
    var text = ""; // for test reasons I will use text field instead of yours HTML element.
    found = false; // false at beginning
    searchValue = 20; // test value
    index = 0;
    //searchValue = 0; why would you constantly search for 0?
    text += "The values in the array are: ";
    while(index < arrNums.length) {
        text += arrNums[index] + " ";
        index++;
    }

    index = 0 // reset pointer

    while (index < arrNums.length) {
        if (arrNums[index] == searchValue) {
            text += "The number " + searchValue + " exists in the array";
            text += "The values in this example do match the vaules you must use.";
            found = true; // true if found
            break; // if found break from while
        }
        
        index++;
    }

    if (!found) { // if not found
       text += "The number " + searchValue + " does not exist in the array";
       text += "The values in this example do not match the vaules you must use.";
    }
    
    console.log(text);
}

start();

输入框中的输入值与数组中的任何值匹配

2 个答案: