通过父项返回不正确的值来查找项的索引

Question

我对jQuery的理解是这两行代码在功能上应该是等价的：

var firstIndex = ui.item.index();
console.log("firstIndex ", firstIndex);

var secondIndex = self.view.ui.childContainer.index(ui.item[0]);
console.log("secondIndex ", secondIndex);

检查我的DOM，我可以清楚地看到ui.item[0].parentNode与self.view.ui.childContainer[0]的元素相同。因此，我希望来自子节点的父节点的被调用索引导致与子节点的被调用索引相同的索引。但是，从父母那里调用时我得到-1。

我误解了什么？

更新：这是一个JsFiddle：http://jsfiddle.net/u2wE9/1/

Answer 1

来自JQuery文档：

  

描述：从匹配的元素中搜索给定元素   元件。

所以它不会搜索孩子们。

如果我理解正确，那就是在这种情况下真正有用的东西（例如）：

HTML：

   <ul id='parent'>
        <li id='child-one'></li>
        <li id='child-two'></li>
        <li id='child-three'></li>
    </ul>

JS：

   var firstIndex = $('#child-three').index();
    console.log("firstIndex ", firstIndex);

    var secondIndex = $("li").index($('#child-three'));
    console.log("secondIndex ", secondIndex);

Answer 2

我认为你应该：

var secondIndex = self.view.ui.childContainer.index(ui.item[0]);

变成：

var secondIndex = self.view.ui.childContainer[0].index(ui.item[0]);

Answer 3

这里的问题是，你没有告诉你的父元素在哪里寻找索引。

$('#parent').index($('#child-three')[0])

以上示例的工作如下：

#child-three元素查找其兄弟节点以查找相对于#parent的索引。所以基本上#parent没有兄弟，所以它返回-1

$('#child-three').index();

上述情况有效，因为#child-three有兄弟姐妹child-one和child-two

From the docs:

  

返回值是一个整数，表示jQuery对象中第一个元素相对于其兄弟元素的位置

所以要解决你需要的问题：

$('#parent > div').index($('#child-three')[0]);

#child-three会尝试找到与#parent直接子div元素相关的兄弟姐妹。