Получить значение индекса DIV

Question

Я застрял здесь с проблемой, пожалуйста, помогите. Что я должен сделать, чтобы получить значение индекса div. Есть 2 списка, и мне нужно вызвать функцию doSomething (); только когда пользователь нажимает первый набор div. Есть ли в любом случае, что я могу достичь этого.

Сценарии и HTML выглядят следующим образом

$(document).ready(function() {
 $(".list-wrapper li").click(function() {
    var index = $(".list-wrapper div").index(this);
    alert(index);
    });
});

<div class="list-wrapper">
<ul>
<li>List 1</li>
<li>List 2</li>
<li>List 3</li>
</ul>
</div>

<div class="list-wrapper">
<ul>
<li>List 1</li>
<li>List 2</li>
<li>List 3</li>
</ul>
</div>

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

Answer 1

jQuery имеет мощные селекторы , поэтому обычно вам не нужно проверять индекс после события. Например:

Для первого div на вашей странице:

$(".list-wrapper:first").click(doSomething);

Для первых <li> с в каждом списке:

$(".list-wrapper li:first-child").click(doSomething);

Если вы все еще хотите найти индекс, вам нужно найти родительский элемент div для нажатой li. Кроме того, селектор .list-wrapper div пуст - у вас нет div s в list-wrapper. Это будет работать:

var parent = $(this).closest('div')
var index = $(".list-wrapper").index(parent);

Answer 2

Есть много способов сделать это:

$('div.list-wrapper').first().click(function() { doSomething(); });

и

$("div.list-wrapper:first").click(function() { doSomething(); });

и

$('div.list-wrapper').eq(0).click(function() { doSomething(); });

- это первые, которые приходят на ум. Pro-tip, включите тип элемента перед классом для скорости (div.blah быстрее, чем .blah)

Или просто получить индекс:

var index = $('div.list-wrapper').index(this);

замените 'this' на родительский для специфичности

Answer 3

, если это нужно только для первого, используйте: первый селектор

http://api.jquery.com/first-selector/

$("div.list-wrapper:first").find("li").click(function() {...

Answer 4

Попробуйте:

<ul><li id="foo">foo</li><li id="bar">bar</li><li id="baz">baz</li></ul>


var listItem = document.getElementById('bar');
alert('Index: ' + $('li').index(listItem));

См. Это для получения дополнительной информации: http://api.jquery.com/index/