為提交按鈕添加onclick功能

Question

有沒有辦法將onclick函數添加到<input type="submit"> ？ 當在表單內單擊提交按鈕時，我想顯示一個名為“div2”的隱藏<div> 。

Answer 1

請記住，您需要停止單擊提交按鈕的默認行為，否則將提交表單，並在顯示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>

使用此代碼，表單現在將不會提交，並且將顯示div 。 如果您稍后想要提交表單，則需要更改showDiv()以返回true ，使用另一個提交按鈕或調用表單的submit()方法。

Answer 2

<script type="text/javascript">
    function clicked() {
        alert('clicked');
    }
</script>

<input type="submit" onclick="clicked();" value="Button" />

Answer 3

我一直在研究它。 我找到了一個非常簡單的方法！ 這里是：

<?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>

在此代碼中，index.html與代碼中的文件相同。 （鏈接到同一文件或“重新加載”）重置是功能的重置按鈕。 所以最后如果你不點擊按鈕，我會是這樣的：

if ( = Reset) test() 

這不是真的所以它不會執行函數test（）

如果按下按鈕，它會將您發送到同一站點，為$ _post提供一個功能

如果你按下按鈕你會得到這個：

if ( Reset = Reset ) test()

這是真的。 並將打印HI！

Answer 4

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
}

如果您沒有使用該按鈕提交表單，我可以建議您使用：

<input type="button" id="showDiv" value="show div" />

Answer 5

假設隱藏的DIV（名為“div2”）被隱藏，因為它的style.display被設置為'none'：

<input type="submit" value="Submit" onclick="document.getElementById('div2').style.display = '';">