Javascript 搜索输入字段以搜索JSON数据

我有一个基于用户需求生成的对象数组

我想做的是：-

我有一个对象数组，它存储在一个变量中，并有一个输入字段

输入字段是类型搜索，因此在我的对象数组中，键是

ItemName

，

BatchCode

，

CasesQty

，

UnitQty

，

PurRate

和

Disc%

我将

ItemName

作为搜索参数

现在，每当用户关注输入字段时，我都在搜索数据，查找

ItemName

，但不知何故，我无法创建必须创建的内容

我想创造一些像

每当用户在输入字段中键入匹配项时，该项也应进入输入字段

在我的代码中，作为搜索参数出现的下拉列表是不可单击的

我的代码

var数据=[{
“项目名称”：“凝乳”，
“批次代码”：400231，
“案例数量”：10，
“单位数量”：5，
“PurRate”：50，
“磁盘%”：6
},
{
“项目名称”：“大米”，
“批处理代码”：400123，
“案例数量”：12，
“单位数量”：7，
“PurRate”：80，
“光盘%”：10
},
{
“项目名称”：“牛奶”，
“批处理代码”：400156，
“案例数量”：4，
“单位数量”：2，
“PurRate”：20，
“磁盘%”：2
},
{
“项目名称”：“黄油”，
“批处理代码”：400564，
“案例数量”：8，
“单位数量”：6，
“PurRate”：35，
“磁盘%”：4
}
]
$（'#searchInput'）.keyup（函数（）{
var searchField=$（this.val（）；
如果（搜索字段==''）{
$（“#筛选记录”）.html（“”）；
返回；
}
var regex=新的RegExp（搜索字段，“i”）；
var输出=“”；
$。每个（数据、函数（键、值）{
if（（val.ItemName.search（regex）！=-1））{
output+='首先从给定对象创建项目名称列表，然后使用自动完成库。我正在使用jQuery库进行自动完成



jQuery UI自动完成-默认功能
$（函数（）{
风险值数据=[{
“项目名称”：“凝乳”，
“批次代码”：400231，
“案例数量”：10，
“单位数量”：5，
“PurRate”：50，
“磁盘%”：6
},
{
“项目名称”：“大米”，
“批处理代码”：400123，
“案例数量”：12，
“单位数量”：7，
“PurRate”：80，
“光盘%”：10
},
{
“项目名称”：“牛奶”，
“批处理代码”：400156，
“案例数量”：4，
“单位数量”：2，
“PurRate”：20，
“磁盘%”：2
},
{
“项目名称”：“黄油”，
“批处理代码”：400564，
“案例数量”：8，
“单位数量”：6，
“PurRate”：35，
“磁盘%”：4
}
]
让itemName=data.map（值=>{return value.itemName}）；
$（“#标记”）.autocomplete({
来源：itemName
});
} );
标签：
你有一个对象数组，而不是Json字符串。那么jquery UI autocomplete呢？@Pradeep实际上我不想使用任何库，但如果它可以像我试图实现的那样完成，那么没有问题这只是一个想法，你可以做一些事情，比如使用下拉菜单最初用一个空数组填充它，然后在更改事件中，给setTimeout为1秒，此时用与输入字符串相对应的项名称填充数组，并为其指定tdropdown@DeepankarSingh不，这可能非常复杂，我尝试了使用下拉菜单输入字段，在下拉菜单中我填充了所有的
ItemName
，并在下拉菜单中提供了一个搜索框来搜索，但不利于用户重新搜索quirement，我想创建一些东西，比如我上传了一张图片嘿，我们不能像我键入的那样做匹配的文本也应该在文本字段中不能理解！哪个文本字段？如果你要查找文本字段，那么这是不可能的，因为文本字段只能包含一个值。实际上我不理解你真正的问题，我很瘦k、 假设我正在键入
curd
，那么当我键入cu时，curd应该在输入字段中填充，作为下拉列表中最接近的匹配值，就像在我的图像中键入的
c
最接近的值填充一样