Javascript 以类似于hover（）方法的方式在焦点和模糊之间切换不起作用

我在Bootstrap4中的一个网站上工作，它有一个搜索栏

我想在

焦点

和

模糊

之间切换，将这两个事件附加到

#组搜索输入

元素。我一直在寻找一种简洁明了的方法来实现这一点，比如

hover（）

方法：

$（'#组搜索输入'）。悬停（函数（）{
$（this）.closest（'div'）.removeClass（'dark'）；
}，函数（）{
$（this）.closest（'div'）.addClass（'dark'）；
});
#组搜索{
填充物：5px；
}
#组搜索输入：焦点{
大纲：无！重要；
盒影：无；
}
#group-search.dark输入，
#group-search.dark按钮{
颜色：#444；
}
#group-search.dark按钮{
边界：无；
背景：ddd；
}

您可以绑定这两个事件，只需切换类即可


$（“#组搜索输入”）。在（'focus blur'，function（）上{
$（this）.closest（'div'）.toggleClass（'dark'）；
});
#组搜索{
填充物：5px；
}
#组搜索输入：焦点{
大纲：无！重要；
盒影：无；
}
#group-search.dark输入，
#group-search.dark按钮{
颜色：#444；
}
#group-search.dark按钮{
边界：无；
背景：ddd；
}

搜寻
您的语法错误，下面是您应该如何使用它


$（“#组搜索输入”）。打开({
焦点：函数（）{
$（this）.closest（'div'）.removeClass（'dark'）；
},
模糊：函数（）{
$（this）.closest（'div'）.addClass（'dark'）；
}
});
#组搜索{
填充物：5px；
}
#组搜索输入：焦点{
大纲：无！重要；
盒影：无；
}
#group-search.dark输入，
#group-search.dark按钮{
颜色：#444；
}
#group-search.dark按钮{
边界：无；
背景：ddd；
}