Javascript onclick 禁用提交按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3186523/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
onclick disable submit button
提问by nuttynibbles
i wanna disable a submit button when onclick. im able to disable the button but i cant submit the post value to php.
我想在点击时禁用提交按钮。我可以禁用该按钮，但我无法将帖子值提交给 php。
采纳答案by nuttynibbles
i found a alternative online. wat i did is to create a fake disable and hidden button. when the actual button is clicked, i will hide it and show the fake disable button.
我在网上找到了一个替代方案。我所做的是创建一个假的禁用和隐藏按钮。单击实际按钮时，我将隐藏它并显示假禁用按钮。
actual button:
实际按钮：
$onclick = "
var boolconfirm = confirm('$strconfirmattempt');
if(boolconfirm==true){
finishattempt.style.display='none';
finishattempt2.style.display='inline';
}
return boolconfirm;";
fake button:
假按钮：
echo "<input type=\"submit\" name=\"finishattempt\" value=\"submit\" onclick=\"$onclick\" />.
<input type=\"submit\" id=\"finishattempt2\" name=\"finishattempt2\" value=\"submit\" style=\"display:none;\" DISABLED/>\n";
回答by Lèse majesté
If you disable an input, then its value naturally won't be included in the form data. You'll need to disable the button afteryou submit. If you bind a callback to onclick, then it runs beforethe form submits.
如果禁用输入，那么它的值自然不会包含在表单数据中。提交后，您需要禁用该按钮。如果您将回调绑定到onclick，则它会在表单提交之前运行。
What you need is something like this:
你需要的是这样的：
jQuery:
jQuery：
$(document).ready(function() {
$(document).unload(function() {
$('#submit-btn').attr('disabled', 'disabled');
});
});
Regular JS:
常规JS：
document.onunload = disableSubmit;
function disableSubmit() {
/* disable the submit button here */
}
Basically, instead of binding to the submit button's onclickevent, this binds the disabling code to the document's unload event (document.onunload), which gets fired once the form is submitted and you begin to leave the page.
基本上，这不是绑定到提交按钮的onclick事件，而是将禁用代码绑定到文档的卸载事件 ( document.onunload)，一旦提交表单并且您开始离开页面，就会触发该事件。
回答by Jonathan Calb
I solved it with simple jQuery. The code removes the button on click, then appends the fake button or some like "loading.." text and finally sends the form.
我用简单的 jQuery 解决了它。代码在点击时删除按钮，然后附加假按钮或类似“加载..”文本，最后发送表单。
HTML:
HTML：
<div class="holder"><input type='submit' value='ACCEPT' class='button'></div>
jQuery:
jQuery：
$('.button').click(function() {
$('.button').remove();
$('.holder').append("//fake input button or whatever you want.");
$('.form').submit();
});
In diference with other methods like unload the button changes in the instant moment you click and sends the form. With heavy forms i think is a better practice.
与其他方法不同，例如卸载按钮在您单击并发送表单的瞬间发生变化。对于重形式，我认为是更好的做法。
回答by Anton
Using jQuery, add onClick handler that returns false:
使用jQuery，添加返回 false 的 onClick 处理程序：
<input type="submit" value="Submit" onClick="$(this).click(function() {return false;});"/>
回答by Maya B Hack
Here's a method using onsubmit instead of onlick:
这是一个使用 onsubmit 而不是 onlick 的方法：
This goes at the top:
这在顶部：
<script type='text/javascript'>
function disableButtons()
{
$('input[type="submit"]').attr('disabled', true);
}
</script>
Then your PHP (note that isset post is NOT for the submit button, because we want to disable the submit button).
然后是您的 PHP（请注意，isset post 不适用于提交按钮，因为我们要禁用提交按钮）。
if (isset($_POST['dothis']))
{
//CODE TO EXECUTE
}
Then HTML.
然后是 HTML。
<form method='post' action='' onsubmit='disableButtons()'>
<input type='hidden' name='dothis' value=''>
<input type='submit' value='Submit'></form>
Onsubmit goes in . Make sure your isset (the PHP part) is for an input that goes with your submit, but is not the submit button itself. You can see that it is the hidden value being checked for with the PHP, rather than the submit button, and the submit button is what gets disabled. By doing this, you can disable a submit button without disabling the PHP.
Onsubmit 进入。确保您的 isset（PHP 部分）用于与提交一起使用的输入，而不是提交按钮本身。您可以看到 PHP 检查的是隐藏值，而不是提交按钮，提交按钮被禁用。通过这样做，您可以在不禁用 PHP 的情况下禁用提交按钮。
回答by Polaris878
You could use a hidden field which would hold the value of the button and pull that value out of your POST data:
您可以使用一个隐藏字段来保存按钮的值并将该值从您的 POST 数据中提取出来：
<input type="hidden" id="hiddenField" value="default" />
<input type="button" id="myButton" onclick="buttonClick();">
function buttonClick()
{
document.myForm.myButton.disabled = true;
document.myForm.hiddenField.value = "myButtonClicked";
}
My PHP is a little rusty, but then you can access the hidden field like so:
我的 PHP 有点生疏，但是您可以像这样访问隐藏字段：
if ($POST['hiddenField'] == "myButtonClicked")
{
// Click handling code here
}
回答by Nic
Why not create a disabled submit button that is hidden, and an active submit button, and onClick show the disabled and hide the active? I could do this in jQuery, but I'm kinda useless without it. Sad, eh?
为什么不创建一个隐藏的禁用提交按钮和一个活动提交按钮，并且 onClick 显示禁用并隐藏活动？我可以在 jQuery 中做到这一点，但没有它我有点无用。难过吧？
