Style.Top屬性不會持續

Question

我的php頁面有問題。 我想要的是一個可以放置表格（插入php）的按鈕，以將其TOP從310px更改為500px。 該表開始如下：

<?php
print('<table id="bloque" style="top:310px;">');
print("<tr>");
print("<th>Código</th>");
?>

我的腳本是這樣的：

<script type="text/javascript">
    function nuevo(){
        document.getElementById("bloque").style.top="500px";
    }       
</script>

我的按鈕是這樣的：

<INPUT TYPE="submit" VALUE="Nuevo Registro" onClick="nuevo();">

當我單擊該按鈕時，表格會移至前500像素，但立即會回到310像素。 我有缺少的財產嗎？

Answer 1

您使用的是“提交”按鈕，而不是實際按鈕。 將您的HTML更改為

<button type="button" onclick="nuevo();">Nuevo Registro</button>

 function nuevo() { document.getElementById("bloque").style.top = "500px"; } 

 #bloque { position: absolute; } 

 <table id="bloque" style="top:310px;"> <tr> <th>Código</th> </tr> </table> <button onclick="nuevo();" type="button">Nuevo Registro</button> 

Answer 2

我認為您的代碼是正確的，發生的事情是您在代碼中使用了輸入類型Submit，因此發生的是頁面刷新。 然后，您的html返回到第一階段。 一種解決方案不使用提交類型按鈕。

使用示例：

<button id ="button" type="button" onclick="nuevo();">Nuevo Registro</button>