Jquery 在焦点上向文本框添加阴影

我想在我的注册表上产生这种Pinterest效果-当用户关注输入文本字段或文本区域时，我希望该字段或区域周围有一个软阴影，如下所示：

所以我尝试了以下方法-我编写了一个CSS类

.inputShadow{
box-shadow:0 0 10px 5px #900;
}

并尝试使用onFocus=“addShadow（）”添加它，其中是addShadow（）函数：

function addShadow(){
    $(this).addClass("inputShadow");
}

但我没有得到任何阴影。然后我试了一下：

$(function(){
    $("input").onfocus("addClass","inputShadow");
});

$(function(){
    $("input").onfocus("css","box-shadow:0 0 10px 5px #900;");
});

也没有结果。最后我试了一下：

$(function(){
    $("input").onfocus("addClass","inputShadow");
});

$(function(){
    $("input").onfocus("css","box-shadow:0 0 10px 5px #900;");
});

但这也帮不了我

---

有什么办法让它工作吗？谢谢

您使用什么浏览器，因为mozilla和chrome浏览器有不同的css规则

e、 g

---

您使用的浏览器是什么，因为mozilla和chrome浏览器有不同的css规则

e、 g

---

尚未对其进行测试，但应能正常工作：

$(function(){
   $("input").on("focus",function(){
       $(this).addClass(".inputShadow");
   });
});

---

编辑：还要检查浏览器兼容性，如其他答案中所述，

尚未对其进行测试，但这应该可以：

$(function(){
   $("input").on("focus",function(){
       $(this).addClass(".inputShadow");
   });
});

---

编辑：还要检查浏览器兼容性，如其他答案中所述，此任务不需要使用jQuery，您也只能使用css：

input:focus {
  /* Your shadow css here */
  -moz-box-shadow:0 0 10px 5px #900;
  -webkit-box-shadow:0 0 10px 5px #900;
  box-shadow:0 0 10px 5px #900;
}

---

但是creminsn是对的，box shadow可能不适用于所有浏览器，您需要添加特定于浏览器的前缀。

此任务无需使用jQuery，您也只能使用css：

input:focus {
  /* Your shadow css here */
  -moz-box-shadow:0 0 10px 5px #900;
  -webkit-box-shadow:0 0 10px 5px #900;
  box-shadow:0 0 10px 5px #900;
}

---

但克里明森是对的，框阴影可能不适用于所有浏览器，您需要添加特定于浏览器的前缀。

非常感谢！工作出色！我还添加了onBlur来消除阴影，一切都很好！再次感谢！！没问题，检查fox32的答案。它的JavaScript更少，如果它能工作，它肯定是一个更好的选择。是的，测试了它，它就像一个魅力！非常感谢你们两位！：）非常感谢你！工作出色！我还添加了onBlur来消除阴影，一切都很好！再次感谢！！没问题，检查fox32的答案。它的JavaScript更少，如果它能工作，它肯定是一个更好的选择。是的，测试了它，它就像一个魅力！非常感谢你们两位！：）谢谢你的意见！是的，我知道这些问题，我的CSS中也有主题，只是不想在这里输出太多信息。我使用最新的FF，并且我知道它支持box shadow（在其他元素上尝试过），所以我只在这里编写了上面的代码。当然，我为其他浏览器设置了其他规则。甚至对于真正的老IE-

filter:progid:DXImageTransform.Microsoft.Shadow（强度=10，方向=0，颜色='#900'）：）谢谢您的输入！是的，我知道这些问题，我的CSS中也有主题，只是不想在这里输出太多信息。我使用最新的FF，并且我知道它支持box shadow（在其他元素上尝试过），所以我只在这里编写了上面的代码。当然，我为其他浏览器设置了其他规则。甚至对于真正的老IE-
filter:progid:DXImageTransform.Microsoft.Shadow（强度=10，方向=0，颜色='#900'）：）这是一个很好的建议！非常感谢你！现在测试了一下，效果很好！非常感谢。这是一个很好的建议！非常感谢你！现在测试了一下，效果很好！非常感谢。