JQuery - $ ('# test ul> li'). Chỉ mục (2) .hide(); - khả thi?

Question

Tôi có thể làm việc với giá trị chỉ mục dễ dàng như vậy không? Tôi nghĩ rằng việc sử dụng các giá trị chỉ mục tự nhiên sẽ tốt hơn sau đó sử dụng các lớp. Tôi muốn sử dụng .index theo cách đó.

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'); 
}); 

tôi doesnt tìm thấy một đầu mối làm thế nào để làm việc theo cách này với giá trị .index .. là nó có thể làm việc đó một cách dễ dàng với điều này phương pháp??

Answer 1

Bạn có thể sử dụng eq:

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

Nó cũng có thể là một phần của bộ chọn của bạn:

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

Nếu bạn muốn số thứ ba li trong tất cả các ul s trong #test, bạn có thể sử dụng nth-child (lưu ý nó là 1-based):

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

Answer 2

Bạn đang sử dụng nó với một số nguyên (số), nhưng bạn chỉ có thể sử dụng nó với bộ chọn hoặc phần tử. here

Edit:
Bạn có thể viết chức năng riêng của bạn như thế này:

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

Answer 3

Có bạn có thể. Bạn muốn .eq() Tuy nhiên, thay vì .index():

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

Hoặc như là một phần của bộ chọn:

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

Answer 4

$(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>