1

フォームボタンのダブルクリックを防ぎ、要素を数秒間無効にしようとしています。

<form action="#" method="POST">
    <input type="text" />
    <input type="password" />
    <button class="myButton" type="submit">Send</button>
</form>


var that = this;
this.element = $(".myButton");
this.element.click(function(e) {
    this.element.prop("disabled", true);
    window.setTimeout(function() {
        that.element.prop("disabled", false);
    }, 2000);
});

有効化/無効化には成功しますが、.click()関数を使用すると (自動的に? O_o) イベントの伝播が妨げられ、ページはフォームアクション属性のリンクをたどりません。

以前は完全に機能していたフォームボタンに動作を追加しようとしていることに注意してください（ acitonリンクに投稿します）。また、有効化/無効化は完全に機能します（上記のコードの適応で発生した可能性のある最終的なエラーに関係なく）。

PS - すべてのソリューションはクロスブラウザーであり、IE8 と互換性がある必要があります。

4

1 に答える 1

5

ボタンを無効にすると、投稿アクションが実行されなくなります。したがって、フォームを無効にしてから、javascript 呼び出しを使用して実際にフォームを送信する必要があります。それは次のようになります。

$('.myButton').click(function() {
    $button = $(this);
    $button.attr('disabled', true);
    $button.closest('form').submit();
    setTimeout(function() {
        $button.attr('disabled', false);
    }, 2000);
});
于 2015-01-22T14:59:47.710 に答える