Question

我创建了一个网页，其中有一个评论部分，然后我添加了一个用于查看评论回复的按钮，当我点击显示回复的按钮时，按钮显示所有回放评论！

＆＃13;

$('.viewreplycommentbutton').click(function() {
  $('.reply').slideToggle(200);
}
);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div dir="auto" class="usercomment">
  <content>
    <div class="usercommentcontent">
      <a href="" class="deletecommentbutton">×</a>
      <table>
        <tr>
          <td>
            <img id="usercommentimage" src="img/user.jpg">
          </td>
          <td class="usercommentusername">david jacson</td>
        </tr>
      </table>
      <br>
      <div dir="auto" class="usercommentmsg">Thank You Very Much Bro.</div>
      <a class="tooltips viewreplycommentbutton" title="Black">+<span>See Replys</span></a>
      <div class="reply">
        <table>
          <tr>
            <td>
              <img id="usercommentimage" src="img/user.jpg">
            </td>
            <td class="usercommentusername">Michael Walson</td>
          </tr>
        </table>
        <br>
        <div dir="auto" class="usercommentmsg">Thanks.</div>
      </div>
      <div class="reply">
        <table>
          <tr>
            <td>
              <img id="usercommentimage" src="img/user.jpg">
            </td>
            <td class="usercommentusername">Michael Walson</td>
          </tr>
        </table>
        <br>
        <div dir="auto" class="usercommentmsg">Thanks.</div>
      </div>
      <br>
  </content>
  </div>
</div>

＆＃13;

我想成为它，当我点击查看按钮查看特定评论的回复时，只有具体评论显示回复（并非所有评论都查看回复！）。

Answer 1

您需要使用this来引用被单击的元素，然后从那里遍历DOM。另请注意，ID 必须是唯一的：

$('.viewreplycommentbutton').click(function() {
  $(this).next('.reply').slideToggle(200);
});

$('.viewreplycommentbutton').click(function() {
  $(this).next('.reply').slideToggle(200);
});

.reply {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div dir="auto" class="usercomment">
  <content>
    <div class="usercommentcontent">
      <a href="" class="deletecommentbutton">×</a>
      <table>
        <tr>
          <td>
            <img id="usercommentimage" src="img/user.jpg">
          </td>
          <td class="usercommentusername">david jacson</td>
        </tr>
      </table>
      <br>
      <div dir="auto" class="usercommentmsg">Thank You Very Much Bro.</div>
      <a class="tooltips viewreplycommentbutton" title="Black">+<span>See Replys</span></a>
      <div class="reply">
        <table>
          <tr>
            <td>
              <img id="usercommentimage" src="img/user.jpg">
            </td>
            <td class="usercommentusername">Michael Walson</td>
          </tr>
        </table>
        <br>
        <div dir="auto" class="usercommentmsg">Thanks.</div>
      </div>
      <div class="reply">
        <table>
          <tr>
            <td>
              <img id="usercommentimage" src="img/user.jpg">
            </td>
            <td class="usercommentusername">Michael Walson</td>
          </tr>
        </table>
        <br>
        <div dir="auto" class="usercommentmsg">Thanks.</div>
      </div>
      <br>
  </content>
  </div>
</div>
<div dir="auto" class="usercomment">
  <content>
    <div class="usercommentcontent">
      <a href="" class="deletecommentbutton">×</a>
      <table>
        <tr>
          <td>
            <img id="usercommentimage" src="img/user.jpg">
          </td>
          <td class="usercommentusername">david jacson</td>
        </tr>
      </table>
      <br>
      <div dir="auto" class="usercommentmsg">Thank You Very Much Bro.</div>
      <a class="tooltips viewreplycommentbutton" title="Black">+<span>See Replys</span></a>
      <div class="reply">
        <table>
          <tr>
            <td>
              <img id="usercommentimage" src="img/user.jpg">
            </td>
            <td class="usercommentusername">Michael Walson</td>
          </tr>
        </table>
        <br>
        <div dir="auto" class="usercommentmsg">Thanks.</div>
      </div>
      <div class="reply">
        <table>
          <tr>
            <td>
              <img id="usercommentimage" src="img/user.jpg">
            </td>
            <td class="usercommentusername">Michael Walson</td>
          </tr>
        </table>
        <br>
        <div dir="auto" class="usercommentmsg">Thanks.</div>
      </div>
      <br>
  </content>
  </div>
</div>

Answer 2

您可以使用$（this）.attr（“id”）来获取被点击的元素的ID：

$('.viewreplycommentbutton').click(function() {
    var id_string = $(this).attr("id");

    // Prepend the id string with # to reference the object by name...
    alert("You clicked #" + id_string);
});

如何知道哪个链接点击[jQuery]

2 个答案: