jquery получает индекс родителя

#jquery #indexing #parent

Вопрос:

Я столкнулся с проблемой с Jquery и не могу найти решение.

Вот моя структура кода :

 <div class="parent">
    <div class="child"> Click here</div>
</div>
<div class="parent">
    <div class="child"> Click here</div>
    <div class="child"> Click here</div>
</div>
<div class="parent">
    <div class="child"> Click here</div>
</div>
 

Я хотел бы получить индекс родительского div, когда я нажимаю на любой дочерний div. Например, если я нажму на дочерний элемент второго родительского div, я хотел бы получить 2. Я не могу найти правильную строку Jquery для этого.

Кто-нибудь когда-нибудь делал это ?

Спасибо

Комментарии:

1. api.jquery.com/index ? Он основан на нуле, поэтому вашему второму потребуется 1

2. К сожалению, jQuery(это).parent().index() всегда возвращает мне одно и то же значение, если я нажимаю на потомка первого родителя или потомка второго.

3. И да, я знаю для 1-го раза 🙂

4. Можете ли вы добавить существующий jquery? Событие щелчка — вы используете () => ?

Ответ №1:

индекс()

Если методу .index() не передается аргумент, возвращаемое значение представляет собой целое число, указывающее положение первого элемента в объекте jQuery относительно его родственных элементов.

 $(".child").click(function() {
  console.log($(this).closest(".parent").index()   1);
}); 
 .parent {
  border-bottom: 1px solid red;
} 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <div class="parent">
    <div class="child"> Click here</div>
  </div>
  <div class="parent">
    <div class="child"> Click here</div>
    <div class="child"> Click here</div>
  </div>
  <div class="parent">
    <div class="child"> Click here</div>
  </div>
</div>