最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Search array using user input - Stack Overflow

programmeradmin2浏览0评论

I want to be able to search an array with the input a user has entered. So for example if the user enters "18" into the input field, either "value not found" would appear or "value found" would appear depending on whether the number 18 was in the array.

This is what I have so far.

var search = document.getElementById("search");
var arr = [18,23,20,17,21,18,22,19,18,20];

function beginhere() {
   var input = document.getElementById("Input").value;

   for (i=0; i<arr.length; i++){
      if (arr[i] == Input) {
         alert(arr[i]);
      } else {
         alert("Value not found");
      }
   }
};

I want to be able to search an array with the input a user has entered. So for example if the user enters "18" into the input field, either "value not found" would appear or "value found" would appear depending on whether the number 18 was in the array.

This is what I have so far.

var search = document.getElementById("search");
var arr = [18,23,20,17,21,18,22,19,18,20];

function beginhere() {
   var input = document.getElementById("Input").value;

   for (i=0; i<arr.length; i++){
      if (arr[i] == Input) {
         alert(arr[i]);
      } else {
         alert("Value not found");
      }
   }
};
Share Improve this question asked Apr 8, 2017 at 11:45 KarlKarl 831 gold badge4 silver badges9 bronze badges 1
  • javascript is case sensitive – charlietfl Commented Apr 8, 2017 at 11:47
Add a ment  | 

3 Answers 3

Reset to default 1

Your mistake is the case sensitive i in Input

 if (arr[i] == Input) {

should be

 if (arr[i] == input) {

And then you really don't need the else part. Just write the not found alert after the loop and write a return statement inside the if.

function beginhere() {
   var input = document.getElementById("Input").value;

   for (i=0; i<arr.length; i++){
      if (arr[i] == input) {
         alert(arr[i]); 
         return;
      }
   }
   alert("Value not found");
};

And without a loop you can try

function beginhere() {
   var input = document.getElementById("Input").value;

     if(arr.indexOf(parseInt(input)) != -1) {
          alert(input); 
          return;
      }
   alert("Value not found");
};

I've refactored your if conditions, because as for now it alerts result with every cycle of the for loop. If the loop has found the given number inside the array, log the number and return the function (there's no need to keep the loop alive anymore). If not - log that value wasn't found to the console.

var arr = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];

function beginhere() {
  var input = document.getElementById("Input").value;
  for (i = 0; i < arr.length; i++) {
    if (arr[i] == input) {
      console.log(arr[i]);
      return;
    }
  }
  console.log('value not found');
};
<button onclick="beginhere()">click</button>
<input id='Input'>

Another possible solution, using Array#find.

var arr = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];

function beginhere() {
  var input = document.getElementById("Input").value,
      res = arr.find(v => v == input);
      console.log(res ? res : "wasn't found");
};
<button onclick="beginhere()">click</button>
<input id='Input'>

You have some issues:

  • Move search declaration and initialization inside of the function, because you need the actual value and not the value at start.

  • Convert the search value to a number by adding a plus infront of the value. This uses an unary plus + for converting a value (string or number) to a number.

  • Test with search.

  • Exit function if search is found.

  • Display only one message, if not found after the loop.

var arr = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];

function beginhere() {
    var search = +document.getElementById("search").value, // need to covert to integer
        i; // declaration missing

    for (i = 0; i < arr.length; i++) {
        if (arr[i] == search) { // use search variable
            alert(arr[i]);
            return;
        }
    }
    alert("Value not found");
}
<input id="search" type="text" onchange="beginhere()">

发布评论

评论列表(0)

  1. 暂无评论