0

お問い合わせフォームのすべてのフィールドのリセット機能を発見しました。この機能が数秒後にスムーズにフェードインして適用されることを望みます。

これは、ユーザーが再度メールを送信できるようにリセットするためのコードです。

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

こんなことがありえるのかな？と思いました。挿入された実際のコンテンツのフェードアウト機能も追加する必要があるのでしょうか? しかし、私は現時点では jQuery の専門家ではありません。

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

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

2 に答える 2

2

フェードイン/フェードアウトからのコールバックでリセットを使用してみてください。

次のスニペットは、タイプが text および textarea のすべての入力をフェードアウトします。この後、値が消去され、要素がフェード インされます。

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/

于 2013-11-13T10:48:07.397 に答える