Style.Top属性不会持续

时间:2017-05-13 07:50:38

标签: javascript php html css

我的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();">

当我点击按钮时,表格会进入Top 500px,但会立即回到310px。是否有我失踪的财产?

2 个答案:

答案 0 :(得分:2)

您正在使用提交而非实际按钮。 将您的HTML更改为

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

&#13;
&#13;
function nuevo() {
  document.getElementById("bloque").style.top = "500px";
}
&#13;
#bloque {
  position: absolute;
}
&#13;
<table id="bloque" style="top:310px;">
  <tr>
    <th>Código</th>
  </tr>
</table>


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

答案 1 :(得分:1)

我认为你的代码是正确的,发生的是你在代码中使用输入类型提交,所以会发生什么是页面刷新。然后你的html返回第一阶段。一种解决方案不使用提交类型按钮。

使用示例:

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