2011-01-04 21 views
8

Czy mogę tak łatwo pracować z wartością indeksu? Myślę, że używanie naturalnych wartości indeksu jest lepsze niż używanie klas. Chcę użyć .index w ten sposób.

Html

<div id="test"> 
<ul> 
<li>Im index 0</li> 
<li>Im index 1</li> 
<li>Im index 2</li> 
<li>Im index 3</li> 
</ul> 
</div> 

Pseudo (jQuery) Javascript

$('#test ul > li').index(2).hide(); 

$('#test ul > li').index(1).click(function() { 
alert('lulz you clicked the li with the index value of 1 bro'); 
}); 

I robi znaleźć pojęcia jak działa w ten sposób z wartością .Index .. czy to możliwe, aby pracować z tym, że łatwo metoda??

Odpowiedz

12

Można użyć eq:

$('#test ul > li').eq(2).hide(); 

To może być również częścią selektora:

$('#test ul > li:eq(2)').hide(); 

Jeśli chcesz trzeci li we wszystkich ul sw #test, można użyć nth-child (zauważ, że jest 1-based):

$('#test ul > li:nth-child(3)').hide(); 
1

Używasz go z liczbą całkowitą (liczba), ale możesz go używać tylko z selektorem lub elementem. here

Edit:
Można napisać własną funkcję tak:

function indexValue(index) 
{ 
    $(element).each(function(key, val) { 
     if(key+1 == index) // + 1 because you started from 0 
     { 
      return val; 
     } 
    }); 
} 
5

Tak można. Chcesz .eq() jednak zamiast .index():

$('#test ul > li').eq(2).hide(); 

lub jako część selektora:

$('#test ul > li:eq(2)').hide(); 
0
$(document).ready(function(){ 
    $("button#1").click(function(){ 
    $("p").hide(); 
    }); 
}); 
$(document).ready(function(){ 
    $("button#2").click(function(){ 
    $("p").show(); 
    }); 
}); 
<button id="1">Clica-me</button> 
<button id="2">Volta-me</button>