Question

一旦通过POST方法发送数据，我希望文本框消失。但我不能让Javascript工作。页面保持重新加载，因此文本框始终存在。

<script>
function puff()
{
if (document.getElementById("updat").style.display == "block")
    document.getElementById("updat").style.display = "none";
else
    document.getElementById("updat").style.display = "block";
}
</script>
</head>
<body>
<div class="container" id="upd">
  <form class="form-signin" action="rough_page.php" method="POST">
    <div class="input-group" id="updat">
    <input type="text" name="text1" class="form-control" value=""/>   
    <input type="text" name="text2" class="form-control" value=""/>
    <input type="text" name="text3" class="form-control" value=""/>
    <input type="text" name="text4" class="form-control" value=""/>
    <input type="hidden" name="flag" class="form-control" value=""/>
    </div>
    <button class="btn btn-lg btn-primary btn-block" onclick="puff()" type="submit">Update</button>
  </form>
</div>
</body>

点击按钮后，我希望文本框消失，我希望再次单击按钮后再重新显示。

Answer 1

请注意，每次按下按钮都会提交表单，因此浏览器必须“重新加载”＃34;这页纸。我引用了引号，因为它不是真正的重载。如果您放入其他目的地，您会看到您转到另一个页面，因为它是表单目的地。

如果你想避免重新加载，有几种方法可以做到这一点，例如阻止提交事件，将提交类型按钮更改为普通按钮，......某些方法比其他方式更正确。

然后你应该用AJAX来处理你的请求，就像@Andreas建议的那样。

当您处理这样的请求时，您可以解决问题，显示或不显示文本框，例如@Rahele建议你。

无论如何，试着看一下javascript文档，因为整个事情听起来好像你不了解表单提交工作的一些基础知识。

Answer 2

试试这个：

function puff() {
    var x = document.getElementById("updat");
    if (x.style.display === "none") {
        x.style.display = "block";
    } else {
        x.style.display = "none";
    }
}

样式更改没有生效使用JavaScript

2 个答案: