首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >循环遍历一组窗体,并在单击按钮时显示相应的

循环遍历一组窗体,并在单击按钮时显示相应的
EN

Stack Overflow用户
提问于 2019-06-05 20:39:59
回答 3查看 68关注 0票数 2

我的评论区有一个“回复”按钮。我想要显示适当的形式,如果回复按钮被点击。(评论最多5条)

我试过下面的代码,它对我不起作用

代码语言:javascript
复制
var comment = document.getElementsByClassName('showreply');

function replyComment() {
     var i;
     for(i = 0; i <= comment.lenght; i++) {
           comment[i].style.display='block';
     }
}

当我点击回复按钮时,没有任何反应...

让我进一步打破这个问题。

我有一个网页,显示一个文件(存储在数据库中),当有人访问它(登录用户或访客)。

当显示该文件时,接下来是该文件的注释(也存储在数据库中)。每条评论都有一个写着“回复”的按钮和一个div内的回复表单。默认情况下,div是隐藏的。

请注意,注释大于1。因此,我希望在单击回复按钮时显示相应的回复表单……

任何人都知道实现这一点的更好方法。

我希望下面的代码能帮助你理解我要找的东西。

代码语言:javascript
复制
<div class="music_comments">
                      <div class="comment_title"><i class="far fa-comments"></i> Comments (<?php echo $mcCount; ?>)</div>

                      <!-- Music Comments -->
                      <?php
                      while ($mccinfo = mysqli_fetch_array($mComments)) {
                          $ppid = $mccinfo['ID'];
                          $p = $mccinfo['poster'];

                          if($p != 'Guest') {
                              $poster = getUserInfo2($mccinfo['poster'], 'firstname'). ' ' . getUserInfo2($mccinfo['poster'], 'lastname');
                              $photo = getUserInfo2 ($p, 'photo');
                              $r = "<a href='/$p' title='$poster'>$poster</a>";
                          } else {
                              $poster = 'Guest';
                              $photo = '/images/avatar/avatar5.png';
                              $r = $poster;
                          }


                          $comment = $mccinfo['comment'];
                          $date = $mccinfo['date'];
                          $cq = mysqli_query($conn, "SELECT * FROM banabase_musiccommentreply WHERE commentID=$ppid AND musicID=$id");

                          $clikecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=1 AND commentID=$ppid AND musicID=$id"));

                          $cdislikecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=2 AND commentID=$ppid AND musicID=$id"));

                        $k = (str_shuffle('ABCDEFGHabcdefgh1234567890'));
                        $resetCode = substr ($k, 0, round(strlen($k)/2, 1));

                        $k2 = md5 (rand(000000, 999999));
                        $k3 = md5 (rand(000000, 999999));
                        $resetCode2 = substr ($k2, 0, round(strlen($k2)/5, 1));
                        $resetCode3 = substr ($k3, 0, round(strlen($k3)/5, 1));

                        $r2 = $resetCode2;
                        $r3 = $resetCode3;

                        $r1 = $r2. $ppid . $resetCode;
                        $r3 = $r3. $id . $resetCode;


                          echo "<div class='comment'>
                          <table cellspacing='5' cellpadding='2'>
                            <tr>
                                <td width='6%'>
                                    <img src='$photo' height='50' width='50' alt='+' title='$poster'> 
                                </td>
                                <td width='94%'>
                                    <p style='margin-top: -2px; margin-bottom: 7px;'>
                                    <small>
                                   $r said:
                                    </small>
                                    <span class='msgtime right'>".timeAgo($date)."<span>
                                    </p>
                                    $comment<br>"; ?>
                                    <small class='comment-action right'>
                                    <a href='/music/react.php?like&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Like'><i class='far fa-thumbs-up'></i></a> <?php echo $clikecount; ?> &nbsp;&nbsp;&nbsp; <a href='/music/react.php?dislike&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Dislike'><i class='far fa-thumbs-down'></i></a> <?php echo $cdislikecount; ?> &nbsp;&nbsp;&nbsp; <a href='#reply' onclick="showForm();" title='Reply this comment'>Reply</a>
                                    </small>


                                <?php echo "</td>
                            </tr>
                        </table>"; ?>


                      <!-- 1st Comment Reply Form -->
                        <div id='comment-reply' class="showreply">
                    <div id="reply" style="position: relative; top: -110px;"></div>
                  <center>
                      <form action="<?php echo htmlspecialchars('#'); ?>" method="post">
                          <h4 style="margin-bottom: 3px; color: #aaa;">Reply this Comment</h4>
                          <input type="hidden" name="poster" value="<?php if(isLoggedIn()) echo $user; else echo 'Guest'; ?>">
                          <input type="hidden" name="musicID" value="<?php echo $id; ?>">
                          <input type="hidden" name="commentID" value="<?php echo $ppid; ?>">
                          <textarea name='comment' width='40' rows='3'></textarea><br>
                          <input type="submit" name="reply" class="btn success" value="Reply">
                      </form>
                  </center>
                        </div>

                      <!-- First Comment Reply-->
                      <?php
                          while ($cr = mysqli_fetch_array($cq)) {

                          $r = $cr['ID'];
                          $rp = $cr['poster'];
                        $rrrcq = mysqli_query($conn, "SELECT * FROM banabase_musiccommentreply WHERE commentID=$r AND musicID=$id");

                        if($rp != 'Guest') {
                            $prp = getUserInfo2($cr['poster'], 'firstname'). ' ' . getUserInfo2($cr['poster'], 'lastname');
                            $rphoto = getUserInfo2 ($rp, 'photo');
                            $rpl = "<a href='/$rp' title='$prp'>$prp</a>";
                        } else {
                            $prp = 'Guest';
                            $rphoto = '/images/avatar/avatar5.png';
                            $rpl = $prp;
                          }

                          $rc = $cr['comment'];
                          $rd = $cr['date'];

                        $rlikecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=1 AND commentID=$r AND musicID=$id"));

                        $rdislikecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=2 AND commentID=$r AND musicID=$id"));

                        $k = (str_shuffle('ABCDEFGHabcdefgh1234567890'));
                        $resetCode = substr ($k, 0, round(strlen($k)/2, 1));

                        $k2 = md5 (rand(000000, 999999));
                        $k3 = md5 (rand(000000, 999999));
                        $resetCode2 = substr ($k2, 0, round(strlen($k2)/5, 1));
                        $resetCode3 = substr ($k3, 0, round(strlen($k3)/5, 1));

                        $r2 = $resetCode2;
                        $r3 = $resetCode3;

                        $r1 = $r2. $r . $resetCode;
                        $r3 = $r3. $id . $resetCode;

                              echo "<div class='comment' style='margin-left: 40px; background: #eee;'>
                          <table cellspacing='5' cellpadding='2'>
                            <tr>
                                <td width='6%'>
                                    <img src='$rphoto' height='50' width='50' alt='+' title='$prp'> 
                                </td>
                                <td width='94%'>
                                    <p style='margin-top: -2px; margin-bottom: 7px;'>
                                    <small>
                                    $rpl replied:
                                    </small> 
                                    <span class='msgtime right'>".timeAgo($rd)."<span>
                                    </p>
                                    $rc<br>"; ?>

                                    <small class='comment-action right'>
                                    <a href='/music/react.php?like&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Like'><i class='far fa-thumbs-up'></i></a> <?php echo $rlikecount; ?> &nbsp;&nbsp;&nbsp; <a href='/music/react.php?dislike&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Dislike'><i class='far fa-thumbs-down'></i></a> <?php echo $rdislikecount; ?> &nbsp;&nbsp;&nbsp; <a href='#reply' onclick="showForm();" title='Reply this comment'>Reply</a>
                                    </small>

                      <!-- Second Comment Reply Form-->
                      <div id='comment-reply' class="showreply">
                    <div id="reply" style="position: relative; top: -110px;"></div>
                  <center>
                      <form action="<?php echo htmlspecialchars('#'); ?>" method="post">
                          <h4 style="margin-bottom: 3px; color: #aaa;">Reply this Comment</h4>
                          <input type="hidden" name="poster" value="<?php if(isLoggedIn()) echo $user; else echo 'Guest'; ?>">
                          <input type="hidden" name="musicID" value="<?php echo $id; ?>">
                          <input type="hidden" name="commentID" value="<?php echo $r; ?>">
                          <textarea name='comment' width='40' rows='3'></textarea><br>
                          <input type="submit" name="reply" class="btn success" value="Reply">
                      </form>
                  </center>
                        </div>

                      <!-- Second Comment Reply-->

                      <?php echo "
                                </td>
                            </tr>
                        </table>";


                        while ($rrrcr = mysqli_fetch_array($rrrcq)) {
                          $rrrr = $rrrcr['ID'];
                          $rrrrp = $rrrcr['poster'];
                            $rrcq = mysqli_query($conn, "SELECT * FROM banabase_musiccommentreply WHERE commentID=$rrrr AND musicID=$id");

                        if($rrrrp != 'Guest') {
                            $rrrprp = getUserInfo2($rrrcr['poster'], 'firstname'). ' ' . getUserInfo2($rrrcr['poster'], 'lastname');
                            $rrrrphoto = getUserInfo2 ($rrrrp, 'photo');
                            $rrrrpl = "<a href='/$rp' title='$rrrprp'>$rrrprp</a>";
                        } else {
                            $rrrprp = 'Guest';
                            $rrrrphoto = '/images/avatar/avatar5.png';
                            $rrrrpl = $rrrprp;
                          }

                          $rrrrc = $rrrcr['comment'];
                          $rrrrd = $rrrcr['date'];

                        $r2likecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=1 AND commentID=$rrrr AND musicID=$id"));

                        $r2dislikecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=2 AND commentID=$r AND musicID=$id"));

                        $k = (str_shuffle('ABCDEFGHabcdefgh1234567890'));
                        $resetCode = substr ($k, 0, round(strlen($k)/2, 1));

                        $k2 = md5 (rand(000000, 999999));
                        $k3 = md5 (rand(000000, 999999));
                        $resetCode2 = substr ($k2, 0, round(strlen($k2)/5, 1));
                        $resetCode3 = substr ($k3, 0, round(strlen($k3)/5, 1));

                        $r2 = $resetCode2;
                        $r3 = $resetCode3;

                        $r1 = $r2. $rrrr . $resetCode;
                        $r3 = $r3. $id . $resetCode;


                              echo "<div class='comment' style='margin-left: 40px;'>
                          <table cellspacing='5' cellpadding='2'>
                            <tr>
                                <td width='6%'>
                                    <img src='$rrrrphoto' height='50' width='50' alt='+' title='$rrrprp'> 
                                </td>
                                <td width='94%'>
                                    <p style='margin-top: -2px; margin-bottom: 7px;'>
                                    <small>
                                    $rrrrpl replied:
                                    </small> 
                                    <span class='msgtime right'>".timeAgo($rrrrd)."<span>
                                    </p>
                                    $rrrrc<br>"; ?>

                                    <small class='comment-action right'>
                                    <a href='/music/react.php?like&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Like'><i class='far fa-thumbs-up'></i></a> <?php echo $r2likecount; ?> &nbsp;&nbsp;&nbsp; <a href='/music/react.php?dislike&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Dislike'><i class='far fa-thumbs-down'></i></a> <?php echo $r2dislikecount; ?> &nbsp;&nbsp;&nbsp; <a href='#reply' onclick="showForm();" title='Reply this comment'>Reply</a>
                                    </small>

                      <!-- Other Comment Reply Form-->

                      <div id='comment-reply' class="showreply">
                    <div id="reply" style="position: relative; top: -110px;"></div>
                  <center>
                      <form action="<?php echo htmlspecialchars('#'); ?>" method="post">
                          <h4 style="margin-bottom: 3px; color: #aaa;">Reply this Comment</h4>
                          <input type="hidden" name="poster" value="<?php if(isLoggedIn()) echo $user; else echo 'Guest'; ?>">
                          <input type="hidden" name="musicID" value="<?php echo $id; ?>">
                          <input type="hidden" name="commentID" value="<?php echo $rrrr; ?>">
                          <textarea name='comment' width='40' rows='3'></textarea><br>
                          <input type="submit" name="reply" class="btn success" value="Reply">
                      </form>
                  </center>
                        </div>

                      <?php echo "
                                </td>
                            </tr>
                        </table>";

                        while ($rrcr = mysqli_fetch_array($rrcq)) {
                          $rrr = $rrcr['ID'];
                          $rrrp = $rrcr['poster'];

                        if($rrrp != 'Guest') {
                            $rrprp = getUserInfo2($rrcr['poster'], 'firstname'). ' ' . getUserInfo2($rrcr['poster'], 'lastname');
                            $prrphoto = getUserInfo2 ($rrrp, 'photo');
                            $rrrpl = "<a href='/$rrrp' title='$rrprp'>$rrprp</a>";
                        } else {
                            $rrprp = 'Guest';
                            $prrphoto = '/images/avatar/avatar5.png';
                            $rrrpl = $rrprp;
                          }
                          $prrc = $rrcr['comment'];
                          $rrrd = $rrcr['date'];


                        $r3likecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=1 AND commentID=$rrr AND musicID=$id"));

                        $r3dislikecount = mysqli_num_rows( mysqli_query($conn, "SELECT * FROM banabase_musicreaction WHERE type=2 AND commentID=$rrr AND musicID=$id"));

                        $k = (str_shuffle('ABCDEFGHabcdefgh1234567890'));
                        $resetCode = substr ($k, 0, round(strlen($k)/2, 1));

                        $k2 = md5 (rand(000000, 999999));
                        $k3 = md5 (rand(000000, 999999));
                        $resetCode2 = substr ($k2, 0, round(strlen($k2)/5, 1));
                        $resetCode3 = substr ($k3, 0, round(strlen($k3)/5, 1));

                        $r2 = $resetCode2;
                        $r3 = $resetCode3;

                        $r1 = $r2. $rrr . $resetCode;
                        $r3 = $r3. $id . $resetCode;


                              echo "<div class='comment' style='margin-left: 40px; background: #eeee;'>
                          <table cellspacing='5' cellpadding='2'>
                            <tr>
                                <td width='6%'>
                                    <img src='$prrphoto' height='50' width='50' alt='+' title='$rrprp'> 
                                </td>
                                <td width='94%'>
                                    <p style='margin-top: -2px; margin-bottom: 7px;'>
                                    <small>
                                    $rrrpl replied:
                                    </small> 
                                    <span class='msgtime right'>".timeAgo($rrrd)."<span>
                                    </p>
                                    $prrc<br>"; ?>

                                    <small class='comment-action right'>
                                    <a href='/music/react.php?like&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Like'><i class='far fa-thumbs-up'></i></a> <?php echo $r3likecount; ?> &nbsp;&nbsp;&nbsp; <a href='/music/react.php?dislike&cid=<?php echo $r1.'&mid='.$r3; ?>' title='Dislike'><i class='far fa-thumbs-down'></i></a> <?php echo $r3dislikecount; ?>
                                    </small>

                      <?php 
                echo "
                                </td>
                            </tr>
                        </table>
                        </div>";
                        }
                echo "
                                </td>
                            </tr>
                        </table>
                        </div>";
                        }

                echo "
                        </div>";
                        }

                echo "
                        </div>";
                        }

                          ?>
                  </div>
                  <div id="addcomment" style="position: relative; top: -70px;"></div>
                  <center>
                      <form action="<?php echo htmlspecialchars('#'); ?>" method="post">
                          <h4 style="margin-bottom: 3px; color: #aaa;">Add a Comment</h4>
                          <input type="hidden" name="poster" value="<?php if(isLoggedIn()) echo $user; else echo 'Guest'; ?>">
                          <input type="hidden" name="musicID" value="<?php echo $id; ?>">
                          <textarea name='comment' width='40' rows='3'></textarea><br>
                          <input type="submit" name="submit" class="btn success" value="Comment">
                      </form>
                  </center>
EN

回答 3

Stack Overflow用户

发布于 2019-06-05 20:46:30

你在comment.length中拼写错了“length”这个词,作为附注,你可能想要将变量名改为“comments”,因为它包含多个注释。

同样,正如上面提到的,你不需要<=<就足够了。

票数 1
EN

Stack Overflow用户

发布于 2019-06-05 20:46:49

如果您使用jquery,您可以使用closest方法来获取相关注释。

代码语言:javascript
复制
$('.showreply').click(function(){
   $(this).closest('.comment').css('border', '1px solid red');
})

代码语言:javascript
复制
$('.showreply').click(function(){
$('#reply').show();
$(this).closest('.comment').append($('#reply'));
})
代码语言:javascript
复制
#reply{
display:none;
}
代码语言:javascript
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='allcomment'>
<div class='comment'>
<textarea>Test</textarea>
<button class='showreply'>Reply</button>
</div>

<div class='comment'>
<textarea>Test</textarea>
<button class='showreply'>Reply</button>
</div>

<div class='comment'>
<textarea>Test</textarea>
<button class='showreply'>Reply</button>
</div>

<form id='reply'>
Reply here
<textarea></textarea>
</form>
</div>

票数 1
EN

Stack Overflow用户

发布于 2019-06-05 21:15:29

我们可以在jQuery中使用同级内建方法。这是一个有效的演示。

代码语言:javascript
复制
<!DOCTYPE html>
<html>
<head>
    <title>Demonstrating Jquery siblings()</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $('.form').hide(); //Initially hide all comment form

            $('.showreply').click(function(){
                $(this).siblings('.form').slideDown();
            });
        });
    </script>
    <style>
    .cmnt {
        margin:10px 0 10px 0;
    }
    </style>
</head>
<body>
<div class='allcomment'>

    <div class='comment'>
        <br/><br/>
        <textarea>File 1</textarea><br />
        <div class="cmnt">
            Coment testing sample text...
            <button class='showreply'>Reply</button><br />
            <div class="form">
                <input type="text"  placeholder="Field 1" />
                <input type="text"  placeholder="Field 2" />
            </div>
        </div>
        <div class="cmnt">
            Coment testing sample text...
            <button class='showreply'>Reply</button><br />
            <div class="form">
                <input type="text"  placeholder="Field 1" />
                <input type="text"  placeholder="Field 2" />
            </div>
        </div>
    </div>

    <div class='comment'>
        <br/><br/>
        <textarea>File 2</textarea><br />
        <div class="cmnt">
            Coment testing sample text...
            <button class='showreply'>Reply</button><br />
            <div class="form">
                <input type="text"  placeholder="Field 1" />
                <input type="text"  placeholder="Field 2" />
            </div>
        </div>
        <div class="cmnt">
            Coment testing sample text...
            <button class='showreply'>Reply</button><br />
            <div class="form">
                <input type="text"  placeholder="Field 1" />
                <input type="text"  placeholder="Field 2" />
            </div>
        </div>
        <div class="cmnt">
            Coment testing sample text...
            <button class='showreply'>Reply</button><br />
            <div class="form">
                <input type="text"  placeholder="Field 1" />
                <input type="text"  placeholder="Field 2" />
            </div>
        </div>
    </div>

</div>

</body>
</html>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/56460676

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档