Jquery - 使用此选择器

Question

以下jquery在我尝试时工作正常：

var memberPhoto = $('img.memberPhoto');
memberPhoto.hover(function() {
     $('div.memberBackDrop').toggle();
});

但是，当我使用this选择器时，它不起作用 - 如下所示。

$(this,'div.memberBackDrop').toggle();

在这种情况下使用它的正确方法是什么？

---

下面的HTML代码（部分内容）：

<table id="memberPhotos"><tr>
<td><img src="images/online-dating-main/poll-pic1.jpg" class="shadowMild memberPhoto">
<div class="memberBackDrop">
  <h6 class="memberUserName">Summertime09</h6>
  <h6>37, Male</h6>
  <h6>Melbourne</h6>
  <h6>Australia</h6>
</div></td>

<td><img src="images/online-dating-main/poll-pic1.jpg" class="shadowMild memberPhoto">
<div class="memberBackDrop">
  <h6 class="memberUserName">Summertime09</h6>
  <h6>37, Male</h6>
  <h6>Melbourne</h6>
  <h6>Australia</h6>
</div></td>

<td><img src="images/online-dating-main/poll-pic1.jpg" class="shadowMild memberPhoto">
<div class="memberBackDrop">
  <h6 class="memberUserName">Summertime09</h6>
  <h6>37, Male</h6>
  <h6>Melbourne</h6>
  <h6>Australia</h6>
</div></td>

Answer 1

.memberBackDrop不是图像的后代，而是兄弟姐妹。在这种情况下，您想使用.siblings ^[docs]：

$(this).siblings('div.memberBackDrop').toggle();

请确保查看其他tree-traversal methods，当您已经有一个元素的引用时，它会派上用场。

Answer 2

this不是选择器。 this是一个对象。在jQuery中，jQuery（this）通常指向表示当前所选元素的对象。

请改用$('div.memberBackDrop').toggle()。

修改

请改变你的喜欢，

jQuery('img.memberPhoto')
    .hover(function() {
    jQuery(this).siblings('div.memberBackDrop').toggle();
});

您必须选择图片代码的[sibling][1] div。