규소
40
2021-05-05 03:47:36 작성 2021-05-05 03:52:03 수정됨
1
107

토글이 한꺼번에 작동됩니다. 개별적으로 시키는 방법이 없을까요?


약식으로 써본건데 대략 저런 모양입니다.

subject를 누르면 content가 나오는 토글 형식이요

스프링에서 데이터 들고와 jsp에 뿌린 형태입니다.


**style 에 .content는 display: none; 준 상태입니다.

<script>

 var contents="";

 for(var i=0;i<list.length;i++){

contents +="<tr>";

contents +="<td class='subject'>"+list[i].sale_subject+"</td> ";

contents +="</tr>";


        contents +="<tr>";

contents +="<td class='content'>"+list[i].sale_content+"</td> ";

contents +="</tr>";

 

}


 $(document).ready(function(){

        $('.subject').click(function() {

        $('.content').toggle();

        });

        });

</script>


클릭하면 불러온 데이터가 한꺼번에 show 되고 또 누르면 한꺼번에 hide 됩니다.

tr과 td에 배열을 붙여서 가져오면 되려나 하고 eq도 붙여보고 이것저것 찾아보고 했는데

안 됩니다. 방법 좀 알려주세요 ㅠㅠㅠ

0
  • 답변 1

  • kenu
    53k
    2021-05-05 04:36:08

    class에 i를 추가하시면...


    	contents +="<td class='subject'>"+list[i].sale_subject+"</td> ";
    
    -->
    	contents +="<td class='subject" + i +"'>"+list[i].sale_subject+"</td> ";
    
    


  • 로그인을 하시면 답변을 등록할 수 있습니다.