Jquery 取消选择搜索框发光效果作为用户类型

我有一个带有发光效果的搜索框。我只想在用户开始键入时，辉光效果消失。我该怎么做？我在下面提供了我的jQuery脚本+搜索框CSS的一部分。我认为修改必须来自jQuery

（函数（$）{
$（函数（）{
$（'#wsite header search form.wsite search input'）.attr（'placeholder'，'search Store…'））
});
}（jQuery））；
$（文档）.ready（函数（）{
$（“输入[type='text']）。在（'focus'，function（）上）{
$（'.wsite搜索表单'）.css({
“boxShadow”：“0px 0px 10px 2px#fafafa”
});
});
$（“input[type='text']）。在（'blur'，function（）上）{
$（'.wsite搜索表单'）.css({
“boxShadow”：“0px 0px 0px 0px#fafafa”
});
});
});
.wsite搜索表单{
过渡：1s轻松；
边界半径：7px；
高度：30px；
}
您可以使用jquery键控：

以下是您提供的代码示例：


（函数（$）{
$（函数（）{
$（'#wsite header search form.wsite search input'）.attr（'placeholder'，'search Store…'））
});
}（jQuery））；
$（文档）.ready（函数（）{
$（“输入[type='text']）。在（'focus'，function（）上）{
$（'.wsite搜索表单'）.css({
“boxShadow”：“0px 0px 10px 2px#fafafa”
});
});
$（“input[type='text']”）。向下键（function（）{
$（'.wsite搜索表单'）.css({
“boxShadow”：“0px 0px 0px 0px#fafafa”
});
});
});
.wsite搜索表单{
过渡：1s轻松；
边界半径：7px；
高度：30px；
}
我添加了
keyup
事件，请注意，如果当前输入的值不是空的，我还检查了
keyup
内部

以下是一个工作版本：


（函数（$）{
$（函数（）{
$（'#wsite header search form.wsite search input'）.attr（'placeholder'，'search Store…'））
});
}（jQuery））；
$（文档）.ready（函数（）{
$（“输入[type='text']）。在（'focus'，function（）上）{
$（'.wsite搜索表单'）.css({
“boxShadow”：“0 0 10px 2px#ff0000”
});
});
$（“input[type='text']）。在（'blur'，function（）上）{
$（'.wsite搜索表单'）.css({
“boxShadow”：”
});
});
$（“input[type='text']）。在（'keyup'，function（）上）{
if（$（this.val（）！=“”）{
$（'.wsite搜索表单'）.css({
“boxShadow”：”
});
}否则{
$（'.wsite搜索表单'）.css({
“boxShadow”：“0 0 10px 2px#ff0000”
});
}
});
});
.wsite搜索表单{
过渡：1s轻松；
边界半径：7px；
高度：30px；
}

您可以使用jQuery的

请修复您的代码示例辉光效果的确切位置？@Dekel，辉光效果环绕在我的网站上的搜索框中，但在您的示例中没有辉光效果。请再次查看，是的。boxShadow'：'0px 0px 10px 2px#fafafa'是的，它能工作！！非常感谢你@Bagzli。你刚刚搞定了@k4r1没问题，如果答案正确，请将其标记为正确答案。我还添加了更多简化的解决方案来完成同样的任务。@k4r1我还想提醒您不要使用类名，而是使用
$（this）
，因为这将引用您单击的元素，类名将触发wise提示的每个fieldok thx上的效果。我会记住这一点。非常感谢！谢谢你的帮助@Dekel，但我的答案已经解决了
$(document).ready(function() {
  $("input[type='text']").change(function() {
    // If input is not empty
    if($(this).val()) {
       // Remove shadow
    } else {
       // Add shadow
    }
  });
});