Javascript 为提交按钮添加 onclick 功能
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5356011/
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
add onclick function for submit button
提问by zerey
Is there a way to add an onclickfunction to an <input type="submit">? I would like to show a hidden <div>named "div2" when the submit button is clicked inside a form.
有没有办法将onclick函数添加到<input type="submit">? <div>当在表单内单击提交按钮时，我想显示一个名为“div2”的隐藏。
采纳答案by Ewan Heming
Remember that you need to stop the default behavior of clicking the submit button or else the form will be submitted and a new page will load before the divever get's displayed. For example:
请记住，您需要停止单击提交按钮的默认行为，否则将提交表单并在div显示之前加载新页面。例如：
<script type="text/javascript">
function showDiv() {
document.getElementById('div2').style.display = 'block';
return false;
}
</script>
<div id="div2" style="display: none;">Visible</div>
<form name="test_form" action="#">
<input type="submit" onclick="return showDiv();" value="Submit" />
</form>
Using this code the form will now not submit and the divwill be shown. If you then want to submit the form later you need to either change showDiv()to return true, use another submit button or call the submit()method of the form.
使用此代码，表单现在将不会提交并div显示。如果您想稍后提交表单，您需要更改showDiv()为 return true，使用另一个提交按钮或调用submit()表单的方法。
回答by moe
<script type="text/javascript">
function clicked() {
alert('clicked');
}
</script>
<input type="submit" onclick="clicked();" value="Button" />
回答by Theshadowhowling
I've been working on it a little while. I found a very easy way! Here it is:
我已经研究了一段时间。我找到了一个非常简单的方法！这里是：
<?php
function test()
{
print "HI!" ;
}
?>
<form action="index.html" method="post">
<input type="submit" value="Reset" name="reset" >
<?php
if ($_POST["reset"]= Reset) test() ?>
</form>
in this code index.html is the same file as in the code. (link to the same file or "reload") Reset is the reset button for a function. so in the end if you dont click the button, i'll be this:
此代码中的 index.html 与代码中的文件相同。（链接到同一文件或“重新加载”）重置是功能的重置按钮。所以最后如果你不点击按钮，我会是这样的：
if ( = Reset) test()
this is not true so it wont execute the function test()
这不是真的，所以它不会执行函数 test()
if you press the button it will send you to the same site giving the $_post a function
如果您按下按钮，它会将您发送到同一个站点，为 $_post 提供一个功能
if you press the button you will get this:
如果你按下按钮，你会得到这个：
if ( Reset = Reset ) test()
this is true. and will print HI!
这是真的。并将打印 HI！
回答by Teneff
document.getElementById('submit').onclick = function() {
document.getElementById('div2').style.display = 'block';
return false; // this stops further executing of the script so the form will not be submitted
}
if you're not using the button for submitting the form I can suggest you to use:
如果您不使用提交表单的按钮，我建议您使用：
<input type="button" id="showDiv" value="show div" />
回答by Marco Demaio
Supposing your hidden DIV (named "div2") is hidden because its style.display was set to 'none':
假设您隐藏的 DIV（名为“div2”）是隐藏的，因为它的 style.display 设置为“none”：
<input type="submit" value="Submit" onclick="document.getElementById('div2').style.display = '';">
