2012-09-21 3 views
1

나는 아래의 몇 가지 코드가 있습니다JQuery와 .addclass()

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script> 
$(document).ready(function(){ 

    var index=5; 
    $("ul li:last").addClass(function(index) { 
    console.log(index); 
    return "item-" + index; 
    }); 

}); 
</script> 
</head> 
<body> 

<ul> 
<li>11</li> 
<li>12</li> 
<li>13</li> 
<li>14</li> 
</ul> 

</body> 
</html> 

을 그리고 함수 (인덱스)를 참조 아주 명확하게. 그러나 나는 그것이 무엇을하고 있는지 알 수 없다. 나는 새로운 목록이 만들어 질 때 마지막 li이 item-0 클래스를 가졌음을 보았다. 나도 가변 인덱스를 설정하려고 = 5하지만 항목 (5 항목 - 0을 만들기를 바라고) 그것을 전달할 수 없습니다 그래서 함수 (인덱스)의 인덱스는 무엇입니까 getter setter 또는 무엇입니까?

+2

무엇을하려하십니까? – j08691

+0

4 가지 구성 요소 만있는 목록에서 JavaScript (제로 기반) 색인을 사용하여 'item-5'를 얻는 이유는 무엇입니까? –

+0

David 나는 색인 번호가 어디에서 왔는지 알아 내기 위해 var index = 5를 설정했습니다. 방금 5 개를 사용했고, 3 개를 사용할 수있었습니다. 색인이 세터라고 생각했습니다. –

답변

2

index은 선택기가 : last li을 선택하고 선택된 요소가 하나 뿐이므로 인덱스가 0 인 jQuery 콜렉션에서 선택된 요소의 인덱스입니다.

.addClass(function(index, currentClass)) 

당신은 제거 할 수 있습니다 인덱스를 기반으로 클래스를 수정하려는 경우 마지막 선택 :

$("ul li").addClass(function(index) { 
    console.log(index); 
    return "item-" + index; 
}); 

아니면 기반으로 클래스를 마지막 요소를 선택하고 추가 할 경우이 을의를 인덱스 당신은 시도 할 수 있습니다 :

var $lst = $("ul li:last"); 
var ind = $lst.index(); 
$lst.addClass('item-'+ind) 

해당 인덱스가 제로를 기반으로 참고 먼저 선택한 요소의 인덱스는 0

입니다
+0

아 ~ 알았어. 그래서 $ ("li")에서 addClass (function (index)) 컬렉션은 li 요소의 컬렉션이 4이므로 0 요소부터 3 요소까지 4 개를 반환합니다. 감사합니다! –

0

index는 귀하의 경우에 인수이며, 함수에 전달할 수 없습니다. : 마지막 제한 만 마지막 LI로 제한합니다. 다음은 예제가 없습니다. 마지막으로, 각 li에 item-n 클래스를 부여합니다. 여기서 n은 색인입니다.

$(document).ready(function(){ 

    $("ul li").addClass(function(index) { 
    console.log(index); 
    return "item-" + index; 
    }); 

}); 
+0

감사합니다 Kevin 제가 undefined의 게시물 –

0

나는 무엇을 당신이하려는 것은 기존의 많은 요소가 방법에 따라 목록의 마지막 요소를 선택하고 그것을 클래스를 줄입니다 생각 . 그래서,이 시도 :

$(document).ready(function(){ 
    var lis = $("ul li"); 
    $(lis[lis.length-1]).addClass("item-" + (lis.length + 1)); 
}); 

http://jsfiddle.net/P7gRP/

이유 만 하나 요소가 리튬 일치하기 때문에 작동하지 않는 예입니다 이유 : (물론) 마지막. 따라서 현재 귀하의 경우 일치하는 요소의 색인은 0입니다. 을 모두으로 설정하려면 항목에 #의 클래스가 있어야합니다. 그러면 올바른 길을 가고있었습니다. 마지막 부분 : 나는 제거

$("ul li").addClass(function(index) { 
    return "item-" + index; 
    }); 

참고 :이처럼.

+0

에서 이것을 알아 냈습니다. 이것은 다른 영역에서 도움이됩니다. –