用Jquery改变一个字段的背景颜色三秒钟？答案

【问题标题】：changing background color of a field for three second with Jquery?用Jquery改变一个字段的背景颜色三秒钟？
【发布时间】：2012-02-26 09:15:17
【问题描述】：

我是 jquery 的新手。我有一个简单的表单，它有四个字段：用户名是必需的，长度必须是 4 - 8 个字符，出生日期必须是日期，电子邮件地址是必需的 - 必须是有效的电子邮件地址，主页必须是有效的 URL。这部分我已经写在下面的代码中了。

现在这是我的问题：我想添加一个代码“每当规则被破坏时
对于我表单中的字段，该字段必须应用黄色背景颜色三秒钟；然后它变回原来的白色。“你有什么想法吗？非常感谢你的帮助。

$('form').validate();
$("#username").rules("add",{
minlength: 4,maxlength: 8,
messages:{
required: "Required input",minlength: jQuery.format("must be 4-8 characters")}
});

【问题讨论】：

您实际上并没有问任何问题，除了暗示的“有人可以帮我做作业吗？” - 你坚持哪一部分，改变颜色还是三秒延迟？只是为了确认，并记住 jQuery 是 JavaScript，因此你不能在不使用 JavaScript 的情况下使用 jQuery，“使用 jQuery 而不是 JavaScript”是否意味着只使用 jQuery 方法，即使用 jQuery 动画像.delay() 这样的方法，而不是直接用setTimeout() 编码？
jQuery 是 javascript？ jQuery UI 有一个高亮功能，可能很适合你！
首先我不知道如何从验证函数中获取结果来改变他们的背景。正如我在我是 jquery 新手之前所说的那样，我正在寻求帮助来学习并感谢你的帮助

标签： jquery jquery-plugins jquery-selectors

【解决方案1】：

$('form').validate().submit(function(){
     setTimeout(function(){
          $(this).find('.error').removeClass('error');
     }, 3000);
});

验证和提交不必在同一个链上，但想法是你从提交事件中设置一个超时来移除错误状态。

$('form').validate({
      invalidHandler : function(form){
           setTimeout(function(){
               $(form).find('.error').removeClass('error');
           }, 3000);
      }
})

【讨论】：

Fresheyeball ，非常感谢您的宝贵时间。我尝试了您的代码。它为未正确填写的文本字段提供黄色背景色，但计时器不起作用。我什至尝试了 setInterval 而不是 setTimeout。但仍然无法正常工作。任何想法将不胜感激。
计时器不工作可能是提交功能不工作的证据。您能否验证该功能是否正在运行。您可能还想尝试将您的时间作为提交处理程序。我已编辑我的答案以包含该选项。

【解决方案2】：

要使无效字段具有黄色背景色，请添加到您的 CSS：

.error{
    background: yellow;
}

.error 是在验证表单时赋予无效字段的类名。至于将背景改回白色的超时，我已经尝试了一段时间没有运气。任何想法将不胜感激。

【讨论】：

Marjorie Franklin 感谢您抽出宝贵时间，我正在处理 Fresheyeball 发布的代码。它会更改未正确填写的文本字段的背景颜色，但计时器不起作用。