禁用提交按钮会取消表单提交。

Question

我有一个这样的表单：

<form action="lol.php" method="POST">
<input type="text" name="fe" />
<input type="submit" id="submitbtn" value="submit" onclick="this.disabled = true;" />
</form>

在Firefox中，它可以完美地工作，但在Internet Explorer（最新版本）中，按钮变为禁用状态，但表单没有提交。我还尝试过：

<form action="lol.php" method="POST" onsubmit="document.getElementById('submitbtn').disabled = true">

我已从提交按钮中删除了onclick代码，但效果相同。请问我该使用什么代码以便在所有浏览器上都能正常工作？

- fitz

Answer 1

好的，那么一个好的技巧是准备第二个不起作用的虚假按钮：

<form action="lol.php" method="POST">
<input type="text" name="fe" />
<input type="button" id="submitbtnDisabled" disabled="disabled" value="submit" style="display:none;" />
<input type="submit" id="submitbtn" value="submit" onclick="this.style.display='none'; document.getElementById('submitbtnDisabled').style.display='inline';" />
</form>

注意：

因为您说您不使用jQuery，所以我使用标准JavaScript。唯一的建议是使用无侵入式JavaScript，并将内联CSS移动到样式表中，以便将脚本和样式与HTML分离。

- Piotr

Answer 2

这很奇怪。

尝试：

<input type="submit" id="submitbtn" value="submit" onclick="setTimeout(function () { this.disabled = true;}, 0)" />

- Cristian Sanchez

Answer 3

我之前也遇到过这个问题。最终我选择在表单提交后隐藏提交按钮，并用相同文本的禁用按钮替换它。效果非常好。

- Shane Reustle

---

如果没有人提出非黑客方式，我可能不得不这样做。 - fitz

Answer 4

试试这个：

onclick="this.disabled=true;return true;"

否则，MS Explorer 不允许按钮在禁用后继续处理。

- dar7yl

---

不行，不起作用。澄清一下：如果我把文本字段留空，它就不起作用。如果它们被填充了，它就能正常工作。这适用于我尝试过的任何方法。 - fitz

Answer 5

如果你想的话，可以使用jQuery。

试试这个：

$('#submtbtn').submit(function() {
   $(this).attr('disabled', 'disabled');
});

我认为它在所有浏览器上都可以工作。

- Manie