如何让用户输入文本来搜索数组对象,然后输出是否有匹配?请使用纯Javascript
How to let the user input text to search array object, then output if there is a match? Pure Javascript please
我是javascript新手,所以请原谅我。这个网站上的每个人对我们新手来说都是如此的神奇,所以提前谢谢你。所以我在这里…我正在建立一个真正通用的音乐应用程序(有点)。它不会在任何实际场景中使用,它只是用来学习和理解js。所以我被困在几个地方。我有一个数组对象的构造函数,我将专辑推入数组,然后将它们显示到一个表中,该表可以通过单击按钮以不同的方式组织。现在我试图有一个搜索框,将用户输入文本,将其与数组进行比较,然后当有一个匹配显示在输出文本区(或任何最好的)我似乎不能让它工作,任何帮助将不胜感激。还有,我应该有一个窗户吗?Onload事件,并把我所有的函数init?
看到我在一起的一切这是我的小提琴
这里是代码,我似乎不能得到工作:
//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>
相当多的问题,它应该是artists
而不是artist
, output.value
而不是output
,在html中应该是id
而不是name
为textarea
,你需要trim
的用户输入的空白,我从循环内删除了警报(非常烦人)。我肯定还有其他一些事情,但现在已经忘记了。我仍然看到一些可以改进的地方,但我还没有采取任何措施。以下是我的最新消息。(有趣的是,很多代码似乎都很熟悉)。哦,是的,如果您实际上指的是textContent
,那么在使用innerHTML
时要小心,当从input
元素获取用户输入时,请使用value
在赋值语句中使用output.value
代替output
。这样的
output.value = formInput + " , " + album[i].title + " " + album[i].artist;
如果你希望显示多个列表,那么你必须像这样将结果连接起来
var output= document.getElementById("response");
var formInput = document.getElementById("formInput").innerHTML;
output.value = "";
for (var i=0; i<album.length; i++){
if (album[i].artist == formInput) {
output.value += formInput + " , " + album[i].title + " " + album[i].artist;
} else {
alert("not found");
}
}
给你的textarea
标签分配id值"response"
,因为你正在使用getElementById
。
最好使用window.onload
函数来初始化所有函数
- 是否可以从Html本地存储输出到.csv或类似文件
- JSHint是否可以输出有关全局变量的警告
- 创建nonce并将其输出为数据属性是否存在漏洞
- 这两种数组排序算法是否会为任何输入产生不同的输出
- Javascript/AJAX 脚本,用于检查 PHP 页面是否输出 1
- 在 HTML 文件中放置脚本标记是否会改变输出
- “控制台.log”是否在节点.js中缓冲输出
- 如何检查这个由空 json 输出导致的空对象是否真的为空
- 是否可以在chrome中输出日志/跟踪,并删除以进行生产
- 是否可以使用WebAudioApi对HTML5视频元素音频输出进行后期处理
- Box2dWeb中是否有方法将对象的位置.x输出到console.log()
- Javascript检查函数的结果是否已经输出,如果是,则运行该函数
- 是否可以创建一个Vorpal应用程序,命令's的输出直接到达终端,而不是'它自己的外壳
- 根据变量对象是否等于“true”输出内容
- 检查数据库中是否存在搜索项—PHP不会输出任何内容,但仍会向数据库中添加项
- 检查是否将某些文本输出到屏幕PHP
- 检查是否有cookie设置,如果没有输出脚本
- 是否可以不迭代地以格式化的方式输出DataFrame ?
- 如何让用户输入文本来搜索数组对象,然后输出是否有匹配?请使用纯Javascript
- 是否有可能将cookie同意通知与HTML输出缓存结合起来?