Найти индекс элемента в массиве, созданный toArray в JS/JQuery

Question

У меня есть пучок пролетов класса = «изменение», и каждый из них имеет уникальный идентификатор. Я создал массив этих пролетов с использованием:

var changesArray = $('.change').toArray() 

Я хочу, чтобы иметь возможность получить индекс пролета в массиве, когда я нажимаю на него. Я пробовал:

$('.change').click(function(){ 
    var thisChange = $(this).attr('id'); 
    var thisChangeIndex = $.inArray(thisChange,changesArray); 
}); 

Но все, что я получаю, равно -1 для каждого .change Я нажимаю.

Я немного новичок с этим типом кода. Помогите?

Answer 1

Метод toArray говорит

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

Вы ищете конкретный id в массиве - это никогда не сработает.

Если вы хотите, чтобы индекс элемента, который вы можете использовать .index()

$('.change').click(function(){ 
 
    var thisChangeIndex = $('.change').index(this); 
 
    console.log(thisChangeIndex); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <span class="change">change1</span> 
 
    <span class="change">change2</span> 
 
    <span class="change">change3</span> 
 
    <span class="change">change4</span> 
 
</div> 
 
<div> 
 
    <span class="change">change5</span> 
 
    <span class="change">change6</span> 
 
    <span class="change">change7</span> 
 
    <span class="change">change8</span> 
 
</div>

Answer 2

Когда вы звоните toArray, вы получите массив всех DOM узлов, а не JQuery объектов. Вы можете осуществлять поиск по this вместо $(this):

var changesArray = $('.change').click(function(){ 
    var thisChangeIndex = $.inArray(this,changesArray); 
}).toArray(); 

Answer 3

Вы должны держать простой массив уникальные идентификационный только:

var changesArrayIds = $('.change').toArray().map(function(x) { return x.id; }); 

Затем эта линия должна работать нормально:

var thisChangeIndex = $.inArray(thisChange, changesArrayIds); 

Answer 4

Если вы настаиваете на использовании .toArray, который работает http://codepen.io/8odoros/pen/JKWxqz

var changesArray = $('.change').toArray(); 
$('.change').click(function(){ 
    var thisChange = $(this).attr('id'); 
    var thisChangeIndex = -1; 
    $.each(changesArray, function(i, val) { 
     if(thisChange==val.id) thisChangeIndex= i; 
    }); 
    console.log(thisChangeIndex); 
});