Question

我写了这个html：

 <a href="#" class="addcomment">Add Comment</a>
<div id="addcomment">
<form name="comment" action="" method="post">
<input type="text" name="addcomment" size="80" />
<input type="submit" value="Comment">
</form>

我想要的是当我点击＆＃34;添加评论＆＃34;然后应该显示表单以代替＆＃34; 添加评论＆＃34;就像在＆＃34; stackoverflow ＆＃34;上一样。我怎么能做到这一点？

Answer 1

这是一个快速而肮脏的证明，从这里进行优化：

CSS：

#addcomment {
    display : none;
}
.addcomment:active {
    display : none;
}
.addcomment:active + #addcomment {
    display : block;
    position : absolute;
    top : 5px;
}

http://jsfiddle.net/7uax74qd/

Answer 2

使用javascript ...

 <a href="#" id="add" class="addcomment" onclick="show()">Add Comment</a>
<div id="addcomment" style="display:none;">
<form name="comment" action="" method="post">
<input type="text" name="addcomment" size="80" />
<input type="submit" value="Comment">
</form>

然后在JAVASCRIPT中编写一个函数并在锚标记中调用它。

function show()
{
document.getElementById('add').style.display='none';
document.getElementByid('addcomment').style.display='block';
}

html如何为评论表单设置动画

2 个答案: