2013-12-13 3 views
0

내가 DB의 요소의 목록을 가지고 있고 버튼으로 테이블에 표시 : 쇼jQuery를 클릭하고 요소의 표시 목록

<a href="#" class="hiden"></a> 

<div class="object></div> 

내 jQuery를 스크립트에 포함 된 사전 정보를 숨기 입니다 :

$(document).ready(function() { 
    $(".object").hide(); 
    $('.hiden').click(function() { 
     $(".object").toggle(); 
    }); 
}); 

HTML :

<table class="table table-hover"> 
<thead> 
<tr> 
    <th></th> 
    <th></th> 
    <th></th> 
    <th class="but" colspan="2"></th> 
</tr> 
</thead> 
<tbody> 
<?php foreach($model as $object): ?> 
    <tr> 
     <td><a href="#"><?php echo $object->name; ?></a></td> 
     <td></td> 
     <td></td> 
     <td class="but"> 
     <a href="#" class="hiden"></a> 
     </td> 
    </tr> 

    <tr> 
     <td colspan="4"> 
      <div class="object">    
       <table class="table table-bordered"> 
       </table> 
      </div> 
     </td> 
    </tr> 
<?php endforeach; ?> 
</tbody> 
</table> 

a.hiden을 클릭하면 모든 요소가 표시되고 모든 요소가 숨겨지는 문제가 있습니다. 한 요소가 다른 요소를 숨기는 것을 보여주는 동안 나는 원하는 것이다.

+0

다른 요소가 숨기려면 어떤 요소를 유지해야합니까? 아코디언을하려고하십니까? – Jessica

답변

0
$(document).ready(function() { 
    $(".object").hide(); 
    $('.hiden').click(function() { 
     $(this).parents('tr').next().find(".object").toggle(); 
    }); 
}); 
0

켜고 끌 잘 방법입니다 도와주세요,하지만 당신이 그들을 클릭하고 이벤트를 트리거 경우 각 요소는 고유 식별자가 있어야합니다.

0

변경 :

$(".object").toggle(); 

로는 :

$(this).closest('tr').next().find(".object").toggle(); 
0

당신이 설명하는 행동은 당신이 실제로 코딩 것입니다. 선택기

$(".object").toggle() 

.object이 아닌 모든 요소를 ​​토글합니다. 할 수있는 동일한 표의 행 하나만 토글하려면

$('.hiden').click(function() { 
    $(this).parent("tr").next().find(".object").toggle(); 
}); 
관련 문제