Javascript 输入自动完成不'；t与label&；价值

我使用下面的代码输入自动完成，因为我有多个值，所以我添加了

label

以显示，但添加

label

后，我的自动完成功能没有任何作用

有人能帮我解决这个问题吗

功能自动完成（inp、arr）{
无功电流聚焦；
inp.addEventListener（“输入”，函数（e）{
var a，b，i，val=该值；
closeAllList（）；
如果（！val）{
返回false；
}
currentFocus=-1；
a=document.createElement（“DIV”）；
a、 setAttribute（“id”，this.id+“自动完成列表”）；
a、 setAttribute（“类”、“自动完成项”）；
this.parentNode.appendChild（a）；
对于（i=0；i”+arr[i].substr（0，val.length）+“”；
b、 innerHTML+=arr[i].substr（val.length）；
b、 innerHTML+=“”；
b、 addEventListener（“单击”，函数（e）{
inp.value=this.getElementsByTagName（“输入”）[0].value；
closeAllList（）；
});
a、 儿童（b）；
}
}
});
inp.addEventListener（“向下键控”，函数（e）{
var x=document.getElementById（this.id+“自动完成列表”）；
if（x）
x=x.getElementsByTagName（“div”）；
如果（例如keyCode===40）{
currentFocus++；
addActive（x）；
}否则如果（e.keyCode===38）{
当前焦点--；
addActive（x）；
}否则如果（e.keyCode===13）{
e、 预防默认值（）；
如果（当前焦点>-1）{
if（x）
x[currentFocus]。单击（）；
}
}
});
函数addActive（x）{
如果（！x）
返回false；
清除活性（x）；
如果（当前焦点>=x.length）
currentFocus=0；
如果（当前焦点<0）
currentFocus=（x.length-1）；
x[currentFocus].classList.add（“自动完成活动”）；
}
函数removeActive（x）{
对于（变量i=0；i
您可以使用datalist HTML来完成此标记

<input id="myInput" list="" type="text" name="myCountry" placeholder="Country">

<datalist id="countries">
  <option value="Afghanistan">
  <option value="Albania">
  <option value="Algeria">
</datalist>



在选项标签中，您可以添加所有国家/地区列表。
我就是这样修复的：

var itemLabel = arr[i].label,
    itemValue = arr[i].value;

无论您在哪里直接使用
arr[i]
，都可以使用其中一个。我正在
标签
上搜索用户输入的内容，但如果需要，您可以添加
值

您可以查看此小提琴以了解更多详细信息：

希望这有帮助。如果您有任何疑问，请在评论中告诉我

编辑

仅供参考，您可以选中
select2.js
。它提供了自动完成功能以及选择框上的许多其他功能

编辑参考
你读过问题了吗，我提到我需要用标签添加多个值。选择选项后，我需要在输入字段中显示标签，值应该传递到隐藏字段。@SANOJLAWRENS->请检查此项。希望它能满足要求。这是一项伟大的工作，但我要问的是
如何将值传递给隐藏的输入字段
基本上是2个输入字段一个带有选定的标签，另一个带有值->在这里实现了这两个功能：可见的输入有标签，隐藏的输入有值