javascript - 如何让用户输入文本来搜索数组对象，如果匹配则输出？请纯Javascript

Question

我是 javascript 新手，所以请与我交流。这个网站上的每个人对我们新手来说都太棒了，所以提前谢谢你。所以这就是我现在的位置...我正在构建一个非常通用的音乐应用程序(有点像)。它不会用于任何实际场景，只是学习和了解js。所以我被困在几个地方。我有一个数组对象的构造函数，我将相册插入数组中，然后将它们显示到一个表中，该表可以通过单击按钮以不同的方式组织。现在我试图有一个搜索框，它将接受用户输入文本，将其与数组进行比较，然后当输出文本区域中显示匹配项时(或任何最好的)我似乎无法让它工作，任何帮助将不胜感激。另外，我应该有一个 window.onload 事件并将所有函数初始化吗？

查看我所拥有的一切: here is my fiddle

这是我似乎无法工作的代码:

    //function to display artist info inner HTML if in array
    function displaySearchResult() {
    albums.sort(compareSearch);
    var output= document.getElementById("response");
    var formInput = document.getElementById("formInput").innerHTML;
      for (var i=0; i<album.length; i++){
           if (album[i].artist == formInput) {
       output = formInput + " , " + album[i].title + " " + album[i].artist;

   } else {
      alert("not found");
   }
   }
 }

HTML:

    <input type="text" id="formInput" value="Search for an Artist"> </input> <br>
    <button id="search" >Submit</button>
    <p><textarea name="response" rows="0" cols="45" wrap></textarea></p>

Answer 1

问题不少，应该是artists而不是artist，output.value不是output，在textarea的html应该是id而不是name，你需要 trim 用户输入的空格，我删除了来自循环内部的警报(非常烦人)。我确信还有其他一些事情，但现在已经忘记了。我仍然看到许多可以改进的地方，但我还没有采取任何措施。这是我的更新。 (很有趣，很多代码似乎很熟悉)。哦，是的，如果您实际上指的是 textContent，那么在使用 innerHTML 时要小心，并且在从 input 元素获取用户输入时使用 value

http://jsfiddle.net/Xotic750/SSVSW/