JS / JQuery表單提交延遲

Question

我試圖延遲表單的提交，但僅當延遲后觸發提交時，它才不發送帖子值。

這是我的HTML

<form id="form_anim" name="form" autocomplete="off" action="index.php" method="POST">
    <input name="username" id="username" type="text" placeholder="Nome utente" autofocus required>
    <input name="password" id="password" type="password" placeholder="Password" required>
    <a href="#">Hai dimenticato la password?</a>
    <input id="invio" name="invio" type="submit" value="Accedi">
</form>

這是腳本

   $('#form_anim').on('submit', function (event, force) {
    if (!force) {
        var $this = $(this);
        event.preventDefault();
        setTimeout(function () {
            $this.trigger('submit', true);
        }, 2000);
    }
});

請幫幫我。

Answer 1

這將有效地延遲提交您的表格。

$('#form_anim').on('submit', function (e) {
    var form = this;
    setTimeout(function () {
        form.submit();
    }, 2000);
    return false;
});

（順便說一句，您不需要jQuery，除非您想支持IE8及以下版本）

演示頁面

監視您的網絡（通過瀏覽器檢查器）以查看其運行情況

Answer 2

注意確定是否要提交兩次？

$('#form_anim').on('submit', function(event, force) {
    if (!force) {
        var $this = $(this);
        setTimeout(function() {
            event.preventDefault();
            $this.trigger('submit', true);
        }, 2000);
    }
});

Answer 3

我建議您使用不帶type="submit"的按鈕：

<button id="send">Send</button> 

$('#send').on('click', function(event) {                       
    setTimeout(function() {
       $('#form_anim').submit();
    }, 2000);        
});

Answer 4

嘗試按照以下代碼運行順利

<form onsubmit="return delay('1')" id="form_anim" name="form" autocomplete="off" action="#" method="get">
    <input name="username" id="username" type="text" placeholder="Nome utente" autofocus required>
    <input name="password" id="password" type="password" placeholder="Password" required>
    <a href="#">Hai dimenticato la password?</a>
    <input id="invio" name="invio" type="submit" value="Accedi"/>
</form>

Java腳本

<script>
    function delay(a){
        if(a == 1){
            setTimeout(delay(2),2000);
            return false;
        }
        else{
            $("#form_anim").submit();
        }
    }
</script>