Question

我有这个提交work.php的表单。

我想要做的是在提交表单时禁用提交按钮，然后在5秒左右后重新启用它，这样我就不会收到多个帖子。

我该怎么做？

此外，如果我在其中一个文本框中按回车键而提交按钮无法点击，那么它会将我重定向到work.php，这不希望发生。

 <form method="post" action="work.php">
        <strong>Message:</strong>
        <input type="text" id="message" name="message" class="message" />
        <input type="submit" id="submit" onClick="this.value='Processing form';this.disabled=true;if(Submitting()){this.form.submit()}else{this.value='Submit';this.disabled=false;}" value="Submit" />
</form>

Answer 1

<form id="your-form">
    <input type="submit" id="submit" onclick="doSubmit(this);" value="Submit" />
</form>
<script>
    function doSubmit(el) {
        var frm = document.getElementById('#your-form');
        el.value = 'Processing...';
        el.disabled = true;
        frm.submit();
        setTimeout(function(el) {
            el.value = 'Submit';
            el.disabled = false;
        }, 5000);
    }
</script>

这是一种方法。还有其他几个。

Answer 2

您无需担心这一点。如果用户以任何方式阻止表单提交（单击提交或按Enter键），则只向服务器发送一个完整请求 - 每次触发提交时，它都会重置POST并重新开始。

请注意，使用JavaScript来阻止此行为非常糟糕，考虑到禁用JS和垃圾邮件非常容易，这也是浏览器一次只允许一次POST提交的原因之一。

如果你正在使用AJAX（你没有指定），那么你应该使用@ drrcknlsn的答案。

Answer 3

如果您使用Ajax，则使用“Ajax Manager Plugin.”它将阻止双重请求。

这样您就不必担心有人多次点击输入或提交按钮。在完成之前只会有一个请求通过（但到那时我会假设成功消息并清除表单）

html表单按钮停止多个提交

3 个答案: