JQuery：显示关于包含在列表中的唯一元素的信息

Question

我刚开始使用jQuery，并且遇到了一些其他语言可以轻松完成的操作。

我有一个元素列表，每个元素包含一个信息列表。 我的问题来自于我无法使用jQuery来关于这些元素的slideDown或slideUp信息，因为我无法获得每个元素的唯一标识符。

$(function() 
{ 
    classe = "#afficheDetails" + 0; 
    $(classe).click(function() 
    { 
     affiche = "#detailsFeuille" + 0; 
     if($(affiche).css("display") == "block") 
     { 
      $(affiche).slideUp(); 
     } 
     else 
     { 
      $(affiche).slideDown(); 
     } 
    }); 
}); 

更新：

而且，我在一个for循环，所以我并不总是相同数量的元素，以显示...

<p id='afficheDetails<?php echo $i;?>'>to display info, click here</p> 

      <table id='detailsFeuille<?php echo $i;?>'> 
       <tr> 
        ... 
       </tr> 

       <tr> 
        ... 
       </tr> 
</table> 

这种事情是实际上工作，但你可以看到我没有动态添加指令，这都是手动的。我的elem列表可以包含很多元素。

我试图创建一个非匿名函数，但每次我调用它时，都会出现一个错误：myFunction未定义。

你能帮我吗？

Thx！

Answer 1

通过指数

// Select all elements that start with "afficheDetails" 
$("[id^='afficheDetails']").click(function(){ 
    var index = $("[class^='afficheDetails'").index(this); // Index of the element 
    $("[id^='detailsFeuille']").eq(index).slideToggle(); 
}); 

检查这个演示：http://jsfiddle.net/fRyjV/1/

通过ID

$("[id^='afficheDetails']").click(function(){ 
    // Replace the first part of the ID with nothing to get the integer. 
    var id = this.id.replace("afficheDetails", ""); 
    $("#detailsFeuille" + id).slideToggle(); 
}); 

检查这个演示http://jsfiddle.net/fRyjV/