(客户端)禁用提交按钮的最佳方法是什么？
细节：
- 仅在用户单击"提交"按钮之后但在发回到服务器之前禁用
- ASP.NET Webforms(.NET 1.1)
- 首选jQuery(如果有的话)
- 重新加载表单时必须启用(即信用卡失败)
这不是我要做的必要，但是如果有一种简单的方法可以进行而不必进行太多更改，那么我会做的。 (即，如果没有简单的解决方案，我可能不会这样做，所以不必担心挖得太深)
解决方案
回答
在JQuery中：
$('#SubmitButtonID').click(function() { this.disabled = true; });
回答
对于所有通过JQuery提交的按钮，它是：
$('input[type=submit]').click(function() { this.disabled = true; });
或者在提交表单时这样做可能更有用：
$('form').submit(function() {
$('input[type=submit]', this).attr("disabled","disabled");
});
但是我认为，如果我们对上下文有更多了解，我们可以为问题提供更好的答案。
如果这是一个ajax请求，那么我们需要确保在成功或者失败时再次启用提交按钮。
如果这是标准的HTTP表单提交(除了使用javascript禁用按钮)，并且我们这样做是为了防止同一表单的多次提交，那么我们应该在处理该代码的代码中进行某种控制提交数据，因为使用javascript禁用按钮可能不会阻止多次提交。
回答
提交应涵盖的表单有三种方法。使用戴维·麦克劳克林(David McLaughlin)和吉米(Jimmy)的建议。一个将禁用提交按钮表单元素，而另一个将禁用基本HTML表单提交。
第三，这些不会禁止Javascript执行form.submit()。 " OnSubmit =" return false"`方法仅在用户单击输入表单元素中的提交按钮或者按Enter键时适用。客户端脚本也将需要处理。
回答
我猜我们不希望他们在提交处理过程中多次点击"提交"按钮。
我的方法是完全隐藏按钮并显示某种状态指示器(动画gif等)。
这是一个非常人为的示例(从技术上讲，它在原型中，但是我认为jquery版本会非常相似)：
<html>
<head>
<script type="text/javascript" src="include/js/prototype.js"></script>
<script type="text/javascript">
function handleSubmit()
{
$('submit').hide();
$('progressWheel').show();
return true;
}
</script>
</head>
<body>
<img src="include/images/progress-wheel_lg.gif" id="progressWheel" style="display:none;"/>
<input type="submit" name="submit" id="submit" value="Submit" onclick="handleSubmit();"/>
</body>
</html>
回答
怎么样
后面的代码：
btnContinue3.Attributes.Item(" onclick")=" disableSubmit()"
Javascript：
function disableSubmit() {
document.getElementById('btnContinue3').onclick = function() {
alert('Please only click once on the submit button!'); return false;
};
}
这不能解决如果回发超时会发生什么的问题，但它对我有用。
回答
需要注意的是，在提交表单之前，我们不应该禁用该按钮。如果在OnClick事件中使用javascript禁用按钮，则可能会丢失表单提交。
因此，我建议我们通过在图像上方放置图像或者将按钮移出可见范围来使用javascript隐藏该按钮。那应该允许表单提交正常进行。
回答
我们可以执行以下操作：
$('form').submit(function() {
$(this)
.find(":submit,:image") // get all the submit buttons
.attr({ disabled : 'disabled' }) // disable them
.end() // go back to this form
.submit(function() { // change the onsubmit to always reject.
return false;
})
;
});
好处：
- 按Enter键，或者
- 从其他代码调用
form.submit() <button type =" submit"> </ button><input type =" image" />- 真的很短
