使用 setTimeout 提交表单未按预期工作[重复]答案

【问题标题】：form submit with setTimeout not working as expected [duplicate]使用 setTimeout 提交表单未按预期工作[重复]
【发布时间】：2021-10-16 13:38:15
【问题描述】：

我在提交事件处理程序中根据条件和 setTimeout 语句提交表单，但是即使我在 setTimeout 函数中设置了 return false，表单仍然会被提交。

bool = true;
$('.form-example').submit(function(e) { 
    //some_stuff where I am get a value true or false in variable bool
    setTimeout(function () {      
        if(bool) {    
            console.log('form shouldnt submit coz the following statement is return false');
            return false; 
        }else{
            return true;
        }
    }, 1000);           
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form action="" method="post" class="form-example">
        <div class="form-example">
            <label for="name">Enter your name: </label>
            <input type="text" name="username" id="username" required> 
        </div>
        <input type="submit" name="submit_user">
    </form>

【问题讨论】：

只需在提交方法的开头添加e.preventDefault()
submit 事件不会因为您在其中一个处理程序中调用 setTimeout 而暂停。看看.preventDefault()
@SuperDJ 这不是重点，为什么当我在那里返回虚假陈述时提交表单？
@Andreas 我确实放了 e.preventDefault()，但是当验证为真时我无法提交表单，表单提交时没有值。

标签： javascript html jquery forms submit

【解决方案1】：

只有在不想提交表单时才应使用e.preventDefault()。

var bool = false;
$('.form-example').submit(function(e) { 
    //some_stuff where I am get a value true or false in variable bool
    if(bool) {    
        alert('Not submit');
         e.preventDefault();
         return false; 
    } else {
         alert('Submit');
        return true;
    }         
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="" method="post" class="form-example">
        <div class="form-example">
            <label for="name">Enter your name: </label>
            <input type="text" name="username" id="username" required> 
        </div>
        <input type="submit" name="submit_user">
    </form>

【讨论】：

【解决方案2】：

bool = false;
$('.form-example').submit(function(e) { 
    e.preventDefault();
    //some_stuff where I am get a value true or false in variable bool
        if(bool) {    
            alert('Not submit');
            return false; 
        }else{
            alert('Submit');
            $(this).unbind("submit").submit();
            return true;
        }         
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="" method="post" class="form-example">
        <div class="form-example">
            <label for="name">Enter your name: </label>
            <input type="text" name="username" id="username" required> 
        </div>
        <input type="submit" name="submit_user">
    </form>

【讨论】：

提交是一个事件。所以如果你想停止提交，那么你必须使用事件阻止。
如果 bool 为 false 表单应该重新提交，怎么做
检查sn-p。如果 bool 为 false，则它正在提交表单。
它没有提交表单，它只是提醒提交大声笑
检查更新的sn-p。