-1

アニメーションが完成してからフォームを送信しようとしています

コード ------> http://pastie.org/5109573

<form action='loginn.php' method='post'>
    <fieldset>
        <legend>Register</legend>
        <label for='username'>Username*:</label>
        <input type='text' name='username' id='username' maxlength="50"
        />
        <label for='password'>Password*:</label>
        <input type='password' name='password' id='password'
        maxlength="50" /> <a><input class ="animated" type='submit' name='Submit' value='Submit' /></a>

    </fieldset>
</form> 
<span></span>

<script src="jquery.js"></script>
<script>
    $("form").submit(function () {
        event.preventDefault();
        if ($("input:first").val() == "correct") {
            $("span").text("OKAY :D").show().fadeOut(1000);
            $("a").addClass('animated hinge');

            $("span").promise().done(function () {
                return true;
            });

        } else {
            $("span").text("Not valid!").show().fadeOut(1000);
            return false;
        }   
    });
</script>
</body>

</html>

アニメーションが完了する前にフォームが送信されます。

4

2 に答える 2

0

問題はおそらくここにあります:

$("form").submit(function() {
    event.preventDefault();

あなたは宣言していませんevent。これを試して:

$("form").submit(function(event) {

編集:

また、done()メソッドに渡す関数は何もしません。その関数から戻っtrueても、イベントには影響しません。実際、イベントは既に処理されており、関数が実行されるまでにはなくなっています。

コールバックを使用してフォームを送信しようとしている場合はdone、明示的に行う必要があります。再送信時の無限ループを回避するには、名前空間を指定してみてください。

$("form").submit(function(event) {
    var that = this;
    if (event.namespace != 'verified') {
         event.preventDefault();
         if ($("input:first").val() == "correct") {
              $("span").promise().done(function () {
                   $(that).trigger('submit.verified');
              });
         }  else {  
             $("span").text("Not valid!").show().fadeOut(1000);                             
             return false;
         }
    } 
});​
于 2012-10-24T15:32:47.277 に答える
0

次のように、アニメーションのコールバック関数を使用して、アニメーションが完了したときにフォームを送信する必要があります。

$("input[name='Submit']").on('click', function(e) {
    e.preventDefault();
    var form = $(this);
    if ($("input:first").val() == "correct") {
        $("span").text("OKAY :D").show().fadeOut(1000, function() {
            form.submit();
        });
        $("a").addClass('animated hinge');
    } else {
        $("span").text("Not valid!").show().fadeOut(1000);
    }
});​
于 2012-10-24T15:42:33.110 に答える