需要帮助的PHP/jQuery评论脚本 - Need help on PHP/jQuery comments script

我以前问过这个问题，但我没有发布代码。

<?php require(database.php); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.comment-wrap {
    width: 300px;
    overflow: hidden;
    margin-bottom: 10px;
}
.reply {
    overflow: hidden;
    margin-top: 10px;
}
.comment-wrap .replyLink {
    float: right;
}
.comment-wrap .comment {
    float: left;
    margin-left: 5px;
}
.comment-wrap .img {
    background-color: #F00;
    height: 50px;
    width: 50px;
    float: left;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
                $(".reply").hide();
        });
    $(document).ready(function() {
        $('.replyButton').click(function() {
            $(".reply").show();
        });
    });
</script>
</head>
<body>
<?php
$sql= "SELECT * FROM comments";
$result = $database->query($sql);
while($row = mysql_fetch_array($result)) {
    echo '<div class="comment-wrap">';
        echo '<div class="img">' . $row['img'] .'</div>';
        echo '<div class="comment">' . $row['comment'] . '</div>';
        echo '<div class="replyLink">';
        echo '<a href="#" class="replyButton" ">Reply</a></div>';
    echo '</div>';
    echo '<div class="reply">
    Type your message: <br />
      <form id="form1" name="form1" method="post" action="">
            <label for="reply"></label>
            <textarea name="replyMessage" class="replyMessage" cols="45" rows="5"></textarea>
      </form>';
    echo '</div>';
}
?>

</body>
</html>

当用户单击回复按钮时，回复类在之前隐藏的所有评论上展开。但是我希望回复类只在用户点击了回复按钮的评论上展开。

内容将存储在MySQL数据库中，并通过PHP进行检索。但这里我只需要jQuery部分的帮助。我不是要完整的代码，只是给我一些提示，以便我能解决它。

http://andylangton.co.uk/articles/javascript/jquery-show-hide-multiple-elements/

给任何你想应用显示/隐藏功能的元素添加toggle类，这是JS

// Andy Langton's show/hide/mini-accordion - updated 23/11/2009
// Latest version @ http://andylangton.co.uk/jquery-show-hide
// this tells jquery to run the function below once the DOM is ready
$(document).ready(function() {
// choose text for the show/hide link - can contain HTML (e.g. an image)
var showText='Show';
var hideText='Hide';
// initialise the visibility check
var is_visible = false;
// append show/hide links to the element directly preceding the element with a class of "toggle"
$('.toggle').prev().append(' (<a href="#" class="toggleLink">'+showText+'</a>)');
// hide all of the elements with a class of 'toggle'
$('.toggle').hide();
// capture clicks on the toggle links
$('a.toggleLink').click(function() {
// switch visibility
is_visible = !is_visible;
// change the link depending on whether the element is shown or hidden
$(this).html( (!is_visible) ? showText : hideText);
// toggle the display - uncomment the next line for a basic "accordion" style
//$('.toggle').hide();$('a.toggleLink').html(showText);
$(this).parent().next('.toggle').toggle('slow');
// return false so any link destination is not followed
return false;
});
});

文档中应该只有一个具有相同id的元素，因此您可以更改类的id

echo '<a href="#" class="replyButton" ">Reply</a></div>';

并使用jQuery代码代替

$('.replyButton').click(function() {
   $(this).parent().next().show();
});

将显示父元素之后的下一个元素。父元素是.comment-wrap，下一个元素是.reply