打开评论回复表单按钮单击

Question

我有一个博客，每个评论都有一个回复表单。我正在尝试创建一个"回复"。按钮，单击后显示表单。现在，如果我点击任何"回复"按钮，它将只对第一个按钮应用隐藏样式，对第一个div应用块样式。

HTML

<div class="reply">
<button id="replybutton" onclick="replybutton()">Click Me</button>
<div id="replyform">
<form>
...
</form>
</div>
</div>

HTML

function replybutton() {
document.getElementById("replyform").style.display = "block";
document.getElementById("replybutton").style.display = "none";
enter code here

Answer 1

id应该是唯一的。所以每个表单都应该有一个唯一的id。你可以使用一个通用的类来显示/隐藏它们。

当你点击一个按钮时，你应该把它的引用传递给你的onClick函数，比如这个onclick="replybutton(this)，并修改你的onClick函数来针对按钮function replybutton(btn)。如果你想显示/隐藏你的表单，你可以使用nextElementSibling

参见jsFiddle

https://jsfiddle.net/th4dz1q0/2/