php - 通过jquery在循环中显示隐藏元素表元素

Question

我是 Jquery 编码的学习者，我的任务是在单击SPAN元素时显示/隐藏TABLE元素。我尝试使用下面提到的 Jquery 代码，但它不起作用..

HTML代码是：

foreach($array as $key => $arrValue) {
  <span id="link<?=$count?>">$key</span>
    <table id="tbl<?=$count?>">

      foreach($arrValueas $key => $value) {
           <tr><td>$value</td></tr>
      }
   </table>
}

我的 Jquery 代码是：

$(function(){
   // To open/close field's group div
   $("span").each(function (i){
      i++;
      $('#link' + i).click(function (i) {
          $('#tbl' + i).toggle(800);
      });
   });
});

请避免在 HTML 代码中出现 PHP 打开关闭标签问题。

Answer 1

$("span").each(function (){ 
    $(this).click(function () { 
        $(this).next('table').toggle(800); 
    }); 
}); 

Answer 2

try this

$(function(){
   $("span").each(function (i){

      (function(i) {

          $('#link' + i).click(function() {
              $('#tbl' + i).toggle(800);
          });

      }(i));

   });
});

you don't need to increment the variable with i++ oyherwise you won't set the handler on the expected link element. Each() is already incrementing the variable i

Answer 3

尝试这种方式来匹配两个不同的元素组：

这是jsFiddle。

var thumbs = $('ul.thumbHolder li');
var bigImg = $('ul.imgHolder li');

thumbs.click(function() {
    var target = $(this).index();
    bigImg.each(function(i){
        if( i != target){
            $(this).fadeOut(300);
        }else{
            $(this).fadeIn(300);
        }
    });    
});​