我有一个 JavaScript 来切换显示/隐藏 div 类。 div 的内容和激活切换功能的按钮处于 while 循环中。起初我在 JavaScript 中使用了“div id”,但这不起作用,我决定使用“div class”来代替,效果很好。然而,我在默认情况下没有成功隐藏 div,我尝试在 CSS 中使用 display:none 和visibility:hidden,但这根本不起作用(内容总是隐藏的)。如何使用我当前的 JavaScript 默认隐藏 div:
JavaScript
<script language="JavaScript">
$(document).ready(function(){
$(".Comment").click(function(){
$(this).next(".reply").slideToggle("slow");
});
});
</script>
文件.php
<?php
.......................
while($obj = $stmt->fetch())
{
$username = $obj['user_name'];
$comment = $obj['comment'];
$id = $obj['id'];
$userimage = $obj['user_image'];
echo '<div class="comment-item">';
echo '<div class="comment-avatar">';
echo '<img src="user/user_images/'.$userimage.'" alt="avatar">';
echo '</div>';
echo '<div class="comment-post">';
echo '<span style="font-weight:bold;">'.$username.'  said...
</span>';
echo '<p>'.$comment.'</p>';
echo ' <div class="Comment"><input type="button"value="Reply" ></div>';
echo '<div class="reply">';
echo '<form action="" method="post" class="reply"
enctype="multipart/form- data">';
echo '<textarea rows="4" name="txtcomment" style="float:right;resize:
none;margin-top:5px;" cols="50" >';
echo '</textarea>';
echo '</form>';
echo '</div>';
echo '</div>';
echo '</div>';
echo '</div>';
}
?>
最佳答案
这应该有效。这是FIDDLE
<div class="comment">Show/Hide reply.</div>
<div class="reply">A reply from someone.</div>
<script language="JavaScript">
$(document).ready(function(){
$(".reply").hide();
$(".comment").click(function(){
$(this).next(".reply").slideToggle("slow");
});
});
</script>
您应该注意的事情:
Javascript 区分大小写,因此请确保 Comment 类中的 C 正确,并且文档和 javascript 中的 C 正确。
你不能隐藏在CSS中,你必须用如下的样式隐藏它,否则CSS会覆盖javascript。如果您想这样做,您可以将类更改为隐藏。
<div class="reply" style="display:none;">A reply from someone.</div>
我想我现在已经涵盖了所有内容。
关于javascript - 如何设置javascript在while循环中默认隐藏div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31374876/