javascript - クリック時に配列要素の数を尋ねる

Question

クリックして配列要素の数を記録できるかどうかを知りたいです。配列に100以上の要素があります：

var cubesmixed = []; 
var cubes;
for(var i = 0; i < 143; i++) {
    cubes = paper.rect(Math.floor(Math.random()*2000), Math.floor(Math.random()*2000), 0, 0);
    cubes.animate({ width: 25, height: 25 }, 500, "bounce");
    cubesmixed.push(cubes);
}

これらはすべて svg オブジェクトです。クリックすると、前述のように、その要素の数を取得したいと思います。

$(this).click(function() { console.log(index of current element in cubes) });

前もって感謝します！

Answer 1

実際の HTML がどのように見えるか、または配列をどのように構築しているかがわからない場合、次のように動作します (ただし、明らかに、独自の特定のユースケースに合わせて調整する必要があります)。

// creating an array of 'li' elements:
var lis = $('li').map(function(){
    return this;
}).get();

// assigning a click-handler:
$('li').click(function(){
    // using Array.indexOf() to return the index of the 'this' node from the array:
    console.log(lis.indexOf(this));
});

JS フィドルのデモ。

そして、使用するには$.inArray()（を実装していないブラウザの場合Array.indexOf()）：

$('li').click(function(){
    console.log($.inArray(this, lis));
});

参考文献:

• get().
• jQuery.inArray().
• map().

Answer 2

jQuery の$.inArray()メソッドを試す

var that = this;
$(this).click(function() { 
    var indexInArray = $.inArray(that, cubes);
    console.log(indexInArray);
});

配列内のその要素の位置の 0 ベースのインデックスを取得するか、一致が見つからない場合は -1 を取得します。

Answer 3

すべての配列には、lengthその配列の要素数を返すプロパティがあります。

 $(this).click(function() { 
        alert(cubes.length);
 });