单击while循环中的php按钮时获取特定的div

时间:2018-10-09 18:37:06

标签: javascript php jquery while-loop onclick

我有一个while循环吐出多个帖子,每个帖子都有一个名为“ flag_btn”的div按钮,单击时我试图显示表单的相应div容器,所有这些都是通过PHP while循环显示的-

    $sql = "SELECT * FROM table";
    $result = $conn->query($sql);
    if ($result->num_rows > 0) {
        while($row = $result->fetch_assoc()) {
          $post_id = $row['post_id'];
echo "
<div id='flag_btn'>flag </div>
<div id='flag_cont' style='display:none'>
    <form method='post' class='flag_form'>
        <input type='radio' name='flag_reason' value='off'>Its Offensive<br>
        <input type='submit' value='Submit'>
    </form>
</div>
";

这是jquery点击事件-

$('#flag_btn').click(function() {
    $(this).closest('#flag_cont').show(200);
});

但是它不起作用。如何获取单击事件以仅显示与被单击的帖子相对应的flag_cont?

*注意:我没有发布php while循环,因为我认为这是不必要的。

1 个答案:

答案 0 :(得分:1)

在这种情况下,我认为next()更好。

我还用id替换了“按钮”上的class,因此它可以用于多个“按钮”。

$('.flag_btn').click(function() {
  $(this).next('#flag_cont').show(200);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='flag_btn'>flag1</div>
<div id='flag_cont' style='display:none'>
  <form method='post' class='flag_form'>
    <input type='radio' name='flag_reason' value='off'>Its Offensive1<br>
    <input type='submit' value='Submit'>
  </form>
</div>
<div class='flag_btn'>flag2 </div>
<div id='flag_cont' style='display:none'>
  <form method='post' class='flag_form'>
    <input type='radio' name='flag_reason' value='off'>Its Offensive2<br>
    <input type='submit' value='Submit'>
  </form>
</div>
<div class='flag_btn'>flag3 </div>
<div id='flag_cont' style='display:none'>
  <form method='post' class='flag_form'>
    <input type='radio' name='flag_reason' value='off'>Its Offensive3<br>
    <input type='submit' value='Submit'>
  </form>
</div>