jquery - 特定行的 Jquery div 选择器

Question

我有以下 li 作为行。我的要求是当我单击删除锚点时，应该出现弹出 div。

<li class="select">
  <div class="data_options"><a href="#" class="itemDelete">DELETE</a> </div> 
<!-- row hover options here-->
      <!-- popup starts here-->
    <div class="data_popup data_delete"><span class="tip"></span>Are you sure want to delete this file?
  </div>
 <!-- popup ends here--> 
  <div class="cfix"></div>
</li>

我试过了，但它影响了整行。我只需要特定行中的弹出窗口。

$('.itemDelete').live('click', function() {
$('.data_delete').slideToggle('medium');
});

这甚至不起作用。

$('.itemDelete').live('click', function() {
$this.closest('.data_delete').slideToggle('medium');
});

请帮我。

Answer 1

用于this引用单击的那个，然后仅在 parent 中搜索li：

$('.itemDelete').live('click', function() {
    $(this).closest("li").find('.data_delete').slideToggle('medium');
});

.closest("li")使用和之类的东西.find('.data_delete')可以使您的代码更少依赖于您拥有的确切 HTML 结构。这会找到li您所在的任何内容，然后.data_delete在 that 中搜索它li。

Answer 2

$('.itemDelete').live('click', function() {
    $(this).parent().next('.data_delete').slideToggle('medium');
});

Answer 3

首先将 $this 替换为 $(this) ：

$('.itemDelete').live('click', function() {
    $(this).closest('.data_delete').slideToggle('medium');
});

那应该会更好;)。