在我的jQuery为什么indexOf没有找到我的数组中的键？

Question

我一直试图让它工作，但似乎没有任何帮助。

所以我有两个图片都在图片数组。 我想要做的是，当你点击前一张照片时，下一张照片会出现。 我很确定问题在于indexOf，因为它每次都返回-1。

如果我更换行：

pictures[listIndex+1].show("drop", {direction: "up"}, 1000); < ---不工作。

符合：

pictures[1].show("drop", {direction: "up"}, 1000); < ---它的工作原理，但不是非常有用的。

我希望你能理解我的问题是什么，对于我的坏英语感到抱歉。我非常感谢你的帮助。

$(document).ready(function(){ 
    var pictures = [$("#link"), $("#italy1")]; 
    pictures[1].hide(); 
    $("#link").click(function(){ 
     var listIndex = pictures.indexOf($(this)); 
     pictures[listIndex+1].show("drop", {direction: "up"}, 1000); 
    }); 
    $("#italy1").click(function(){ 
     $(this).hide("drop", {direction: "up"}, 1000); 
}); 
}); 

Answer 1

也许jQuery.inArray将做的伎俩。

Answer 2

如果你想选择下一个$("#link")，你总是可以使用$(this).next("#link")。

Answer 3

这是因为你正在将元素包装在jQuery对象中。即使两个jQuery对象包含相同的元素，它们仍然是两个单独的对象，因此indexOf方法找不到另一个。

把元素本身在阵列中：

var pictures = [$("#link").get(0), $("#italy1").get(0)]; 

现在你可以使用一个元素的引用找到数组中的元素。使用$.inArray方法，因为这也能在浏览器不具备Array.indexOf方法：

var listIndex = $.inArray(this, pictures); 

当然，当你从数组元素，你需要用它在一个jQuery对象使用jQuery方法就可以了：

$(pictures[listIndex+1]).show("drop", {direction: "up"}, 1000); 

Answer 4

为了支持Guffa，像这样FIDDLE。

$(document).ready(function(){ 
    var pictures = [$("#link").get(0), $("#italy1").get(0)]; 

    $(pictures[1]).hide(); 

    $("#link").on('click', function(){ 
     var listIndex = $.inArray(this, pictures); 
     $(pictures[listIndex+1]).show("drop", {direction: "up"}, 1000); 
    }); 

    $("#italy1").on('click', function(){ 
     $(this).hide("drop", {direction: "up"}, 1000); 
    }); 
});