为什么我的 $(selector).index(filter selector) 返回不正确的结果？答案

【问题标题】：Why is my $(selector).index(filter selector) returning an incorrect result?为什么我的 $(selector).index(filter selector) 返回不正确的结果？
【发布时间】：2013-05-10 15:04:24
【问题描述】：

我有一个变量pages

pages = $("[data-role=page]:not([data-url])");

这是

[
<div data-role="page" id="home" class="home ui-page ui-body-c" tabindex="0" style="min-height: 548px;">…</div>
, 
<div data-role="page" id="login" class="login ui-page ui-body-c ui-page-active" tabindex="0" style>…</div>
]

但是当我使用pages.index(".ui-page-active") 时，我得到-1 — 一个不正确的结果。

但是，当我搜索 pages.index(".ui-page") 时，我得到了 1 — 正确的结果。

有什么想法吗？

更新：

pages.index( $('.ui-page-active') ) 返回1 — 正确的结果！但是为什么the selector option 不起作用？

【问题讨论】：

请创建一个最小的 jsfiddle 测试用例 - 例如这可以在普通浏览器没有 jquery mobile 上重现吗？
我想你想要$('.ui-page-active').index(pages)
它没有像您期望的那样工作，因为这不是它被记录的工作方式。它不会在当前集合中找到与选择器匹配的元素的索引，而是在通过传入的选择器匹配的元素中找到集合中第一个元素的索引。

标签： javascript jquery dom jquery-mobile filtering

【解决方案1】：

.index() 方法获取当前选择的第一个元素，并在您传递的选择器的所有元素中搜索它。 See the docs

It may help to look at the responsible code

所以当我这样做时：

$('.a').index('.b');

它将为您提供所有找到的 .b 元素中第一个 .a 元素的索引。

看来你想要的与你所拥有的相反，所以可能：

// Find '.ui-page' within the '[data-role=page]:not([data-url])' set:
$('.ui-page').index('[data-role=page]:not([data-url])');

但请注意，这只会在与您传递给 index(...) 的选择器匹配的元素中查找第一个 .ui-page 元素。

【讨论】：