Javascript 如何在使用Jquery进行搜索时隐藏标签和复选框？

对不起，我的英语不好

我正在尝试搜索带有标签和复选框的页面。但我无法在搜索时隐藏复选框和标签。然后，我希望在搜索输入为空时显示所有标签和复选框。嗯，我有一个标签类，但它不起作用

如何使用Jquery实现这一点

有人能帮忙吗？谢谢：）

$（document）.on（“输入”，“搜索列”，函数（））{
var v=$（this.val（）；
var elem=$（“：复选框”）.filter（函数（）{
return（新的RegExp（v，'i'））.test（this.value）；
});
if（elem.val（））{
$（elem.show（）；
$（“：复选框”）.not（elem.hide（）；
}否则{
$（“：复选框”）.hide（）；
}
});
.ccontainer{
保证金：0px自动0自动；
宽度：100%；
文本对齐：居中；
}
输入[类型=复选框]{
显示：无；
}
输入[类型=复选框]+标签{
显示：内联块；
位置：相对位置；
边界半径：40px；
填充：10px 40px；
宽度：10%；
背景：#eeeeee；
字号：600；
字体大小：13px；
颜色：#444；
光标：指针；
}
输入[类型=复选框]+标签：悬停{
背景：#e4；
}
输入[类型=复选框]：选中+标签{
背景#003B46；
颜色：#f0；
}
输入[类型=复选框]：选中+标记div.checkmark{
显示：块；
填充：#f0；
}
@关键帧btn颜色{
0% {
背景：#88d3a6；
}
50% {
背景：5dc386；
}
100% {
背景#3ea868；
}
}



绘画
游泳
跳舞

$（document）.on（“输入”，“搜索列”，函数（））{
var v=$（this.val（）；
$（“：checkbox”）.removeClass（'hide'）；
如果（v！=''）{
var elem=$（“：复选框”）.filter（函数（）{
return（新的RegExp（v，'i'））.test（this.value）；
});
if（elem.val（））{
$（elem.show（）；
$（“：复选框”）.not（elem.hide（）；
$（“：checkbox”）.not（elem）.addClass（'hide'）；
}否则{
$（“：复选框”）.hide（）；
}
}否则{
$（“：复选框”）.hide（）；
}
});
.ccontainer{
保证金：0px自动0自动；
宽度：100%；
文本对齐：居中；
}
输入[类型=复选框]{
显示：无；
}
输入[类型=复选框]+标签{
显示：内联块；
位置：相对位置；
边界半径：40px；
填充：10px 40px；
宽度：10%；
背景：#eeeeee；
字号：600；
字体大小：13px；
颜色：#444；
光标：指针；
}
输入[类型=复选框]+标签：悬停{
背景：#e4；
}
输入[类型=复选框]：选中+标签{
背景#003B46；
颜色：#f0；
}
输入[类型=复选框]：选中+标记div.checkmark{
显示：块；
填充：#f0；
}
@关键帧btn颜色{
0% {
背景：#88d3a6；
}
50% {
背景：5dc386；
}
100% {
背景#3ea868；
}
}
输入。隐藏+标签{
显示：无；
}



绘画
游泳
跳舞
下面是一个使用jQuery的
.toggleClass（）
方法的简单得多的解决方案


将输入和范围包装到标签中（并相应地修改CSS）
为每个标签添加
数据过滤器
属性


$（document）.on（“输入”，“搜索列”，函数（））{
const v=$.trim（$（this.val（））；
$（“[data filter]”）。每个（函数（）{
$（this）.toggleClass（'is-hidden'，！new RegExp（v，'i'）.test（$（this）.data（'filter'））；
});
});
.ccontainer{
保证金：0px自动0自动；
宽度：100%；
文本对齐：居中；
}
输入[类型=复选框]{
位置：绝对位置；
不透明度：0；
}
输入[类型=复选框]+span{
显示：内联块；
位置：相对位置；
边界半径：40px；
填充：10px 40px；
宽度：10%；
背景：#eeeeee；
字号：600；
字体大小：13px；
颜色：#444；
光标：指针；
过渡：背景0.23s；
}
输入[类型=复选框]+范围：悬停{
背景：#e4；
}
输入[类型=复选框]：选中+范围{
背景#003B46；
颜色：#f0；
}
.是隐藏的{
显示：无；
}



绘画
游泳
跳舞
请回答最后一个问题，搜索时如何在复选框中添加动画？好的，您可以发布新问题吗？
标记已放弃。改用CSS（就像你已经做的那样）明白了，谢谢Roko！我是jquery新手，我还在学习。嗯，我是web开发新手，已经两周了。我是一名平面设计师，我和你一样喜欢UI和UX设计。我开始喜欢编码了，你能给我推荐一个路线图吗？这将非常有益：）