循环通过表td将jQuery效果附加到每个td

时间:2012-10-18 17:56:51

标签: jquery loops html-table

我建了这样一张桌子:

<table id="testTable">

   <tr>
    <td dir="ltr"><a href="#">array()</a></td>
    <td>انشاء مصفوفة</td>
    <td>530</td>
    <td><a class="example1" href="#">12.5</a></td>
    <td>12.5</td> 
    </tr>

<thead>
        <tr> 
        <th colspan="5" rowspan="3" class="slide1" >
       <pre class="prettyprint lang-php ">

$a=array("a"=>"Dog","b"=>"Cat","c"=>"Horse");
echo $a["b"];
//الناتج 
Cat 

//مثال اخر
$a=array("Dog","Cat","Horse");
print_r($a);
//الناتج
Array ( [0] => Dog [1] => Cat [2] => Horse ) 

       </pre>
        </th>
        </tr>
        </thead>



     <tr>


                        <td dir="ltr"><a href="">array_push()</a></td>
                        <td>اضافة عنصر او أكثر لنهاية المصفوفة</td>
                        <td>530</td>
                        <td class="example2">12.5</td></td>
                        <td>12.5</td>

     </tr>

<thead>
        <tr> 
        <th colspan="5" rowspan="3" class="slide1" >
       <pre class="prettyprint lang-php ">

$a=array("a"=>"Dog","b"=>"Cat","c"=>"Horse");
echo $a["b"];
//الناتج 
Cat 

//مثال اخر
$a=array("Dog","Cat","Horse");
print_r($a);
//الناتج
Array ( [0] => Dog [1] => Cat [2] => Horse ) 

       </pre>
        </th>
        </tr>
        </thead>




   <tr>
                        <td dir="ltr"><a href="">array_rand()</a></td>
                        <td>استخراج مفتاح عشوائى من المصفوفة</td>
                        <td>530</td>
                        <td class="example3">12.5</td></td>
                        <td>12.5</td>
   </tr>

<thead>
        <tr> 
        <th colspan="5" rowspan="3" class="slide1" >
       <pre class="prettyprint lang-php ">

$a=array("a"=>"Dog","b"=>"Cat","c"=>"Horse");
echo $a["b"];
//الناتج 
Cat 

//مثال اخر
$a=array("Dog","Cat","Horse");
print_r($a);
//الناتج
Array ( [0] => Dog [1] => Cat [2] => Horse ) 

       </pre>
        </th>
        </tr>
        </thead>


........and multiple like that.....




</table>

我希望通过js进行for循环,以滑动切换我点击的同一<thead>的{​​{1}},我尝试了类似的东西:

<td>

但没有发生任何事情。

如何通过每一个迭代这个效果,以滑动切换我通过相同td点击的特定thead?

1 个答案:

答案 0 :(得分:2)

你正在努力做到这一点。

$('table a').click(function() {
   $(this).parents('tr').next('tr').slideToggle(500);
}}

jQuery的优点在于你可以使用RELATIVE选择器。 $(this)将引用点击的元素。 parents('tr')会为您提供该元素的父TR标记。 next('tr')会选择下一个TR标记。根本不需要处理凌乱的ID。目标是获得干净的标记,让jQuery完成繁重的工作。

如果要定位具有特定类的链接,请使用:

$('table a.example')