javascript - 延迟和淡入平滑重置表单功能

Question

我刚刚发现了我联系表单中所有字段的重置功能。我希望在几秒钟后应用此功能并平滑淡入。

这是我用于重置的代码，因此用户可以再次发送电子邮件：

$( 'form' ).each(function(){
    this.reset();
});

我想也许这样的事情是可能的？也许我还需要添加实际插入内容的淡出功能？但我现在不是 jQuery 专家：

var formReset = $( 'form' ).each(function(){this.reset();});

formReset().delay('2000').fadeIn('500');

Answer 1

尝试在fadeIn/fadeOut的回调中使用reset。

以下代码段将淡出所有类型为 text 和 textareas 的输入。在此之后，值被清除并且元素淡入：

function reset(){
    $('#myFormular').children('input:text, textarea').each(function(){
        $(this).fadeOut('slow', function(){
            $(this).val('');
            $(this).fadeIn('slow');
        });
    });
}


$('#resetButton').click(reset);

示例：http: //jsfiddle.net/WsDe2/2/

另一种解决方案是将字体颜色设置为输入元素的背景颜色。然后清除该值并在此更改为本机颜色之后：

function reset(){
    $('#myFormular').children('input:text, textarea').each(function(){
        var baseColor = $(this).css('color');

        $(this).animate({color : $(this).css('background-color')}, function(){
            $(this).val('');
            $(this).css('color', baseColor);
        });
    });
}


$('#resetButton').click(reset);

示例：http: //jsfiddle.net/WsDe2/4/

Answer 2

   this.reset();
   setTimeout(function(){                          
         $('#correct').fadeOut(500);
   },2000); 

利用setTimeout