Jquery div селектор для конкретной строки

#jquery #css #closest

#jquery #css #ближайший

Вопрос:

У меня есть следующие 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');
});

Пожалуйста, помогите мне.

1. Эта конкретная проблема была решена. Если у вас возникла другая проблема, вам следует задать другой вопрос. Вы, конечно, можете добавить ссылку на этот вопрос для справки.

Ответ №1:

Используйте this для ссылки на ту, на которую нажали, а затем выполняйте поиск только в родительской li :

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

Использование таких вещей, как .closest("li") и .find('.data_delete') , делает ваш код намного менее зависимым от точной структуры HTML, которая у вас есть. Это находит то, в чем li вы находитесь, а затем выполняет поиск .data_delete в этом li .

Ответ №2:

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

Ответ №3:

Сначала замените $this на $(this) :

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

Это должно работать лучше ;).