Tag Archives: JavaScript

六 10

jQuery DOM 元素方法index()方法获取值为-1，得不到正确的值

Posted on by

$(selector).index()获得第一个匹配元素相对于其同胞元素的 index 位置

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
$(".newsTab dd:first-child").addClass("hover");
 
$(".newsList dd:first-child").show();
 
(function(){
 
var _left = $(".newsTab dd.hover").position().left;
 
//alert(_left)
 
$(".newsTab span").css({left: _left});
 
$(".newsTab dd").each(function(index, el) {
 
$(this).click(function(event) {
 
if (!$(this).hasClass('hover')) {
 
$(this).addClass('hover').siblings().removeClass('hover')
 
var _left2 = $(this).position().left;
 
$(".newsTab span").stop(true).animate({left: _left2}, 500);
 
$(".newsList dd").hide();
 
$(".newsList dd").eq($(".newsTab dd.hover").index()).show();
 
};
 
});
 
});
 
}())

不懂装懂，帮朋友修改一个JS效果（点击后不显示同胞元素），JQ方法功能也是现查的手册，测试index()返回值是-1，这一定是不正确了。

结果就是一阵的百度搜索，在开源中国的一篇文章中得到了启发：

$(".newsList dd").eq($(".newsTab dd.hover").index()).show();
修改为
$(".newsList dd").eq($(".newsTab dd").index($(".hover"))).show();

解释：

$(“.newsTab dd”)表示找到newsTab类下的所有的dd，返回一个dd的数组的对象；

后面的.index($(“.hover”))表示返回数组对象中的class为hover的对象的坐标。