找到子选择时，JQuery将更改应用于每个子项

我有一个HTML表单

和一组

s

我希望有一个单独的搜索查询，如果值不是空的，则将选项数量限制为与搜索值匹配的选项

我发现有很多类似JQuery的东西可以做到这一点，但它们要么太简单，要么太精确，要么不合适

HTML:

$（文档）.ready（函数（）{
$（'#searcher'）。在（'change'，function（）上{
if（$（this.val（）！=“”）{
var searcher=$（this.val（）.toLowerCase（）；
$（“#pcdupes选择选项”）.filter（函数（）{
返回$（this）.text（）.toLowerCase（）！='：contains（searcher）'；
}).each（函数（{
$（this.hide（）；
});
}否则{
$（“#pcdupes”）.show（）.children（）.show（）；
}
});
});





马
奶牛
绵羊
山羊
失明的帕鲁维怪物蝙蝠
看看这个


$（函数（）{
$（'#searcher'）。在（'input'，function（）上{
const val=this.value；
const$options=$（“#pcdupes select option”）；//将集合存储在变量中
如果（val！=''）{
const searcher=val.toLowerCase（）；
$options//这只是用于存储集合的变量名
.hide（）
.filter（函数（）{
返回此.text.toLowerCase（）.indexOf（searcher）！=-1；
})
.show（）；
}否则{
$options.show（）；
}
});
});





马
奶牛
绵羊
山羊
失明的帕鲁维怪物蝙蝠
这应该做什么<代码>返回$（this）.val（）.toLowerCase（）！='：不：包含（搜索者）'
如果子项的值（选项
与搜索者
搜索到的文本相等，则它应将子项返回到筛选列表。看着它，我怀疑我可能是错误地搜索了
id
值。。。。让我更新一下，
”：not:contains（searcher）
看起来像是一厢情愿的选择器字符串。像
$（“选项：不：包含（+searcher+”）
-同上
'：包含（searcher）
太完美了，谢谢。我不熟悉
$options
语法。它只是一个速记变量吗？它正在缓存选项，所以我只能访问它们一次。我使用$prefix来提醒我它是一个jQuery对象，我可以称它为$myOptions以避免混淆，因为jQuery本身不需要
$
，或者它像
var
引用一样使用它？否-我可以将它称为myjqueryreferencetoppionscollection，而不是选择$options-下划线也是允许的前缀