안녕하세요~ 토글(보이기숨기기) 문의드려요~
본문
문의 드립니다.
게시판 목록에서 내용 바로 보기 하려고 하는데요~
<script src="jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function(){ //DOM이 준비되고
$('#toggleButton').click(function(){ // ID가 toggleButton인 요소를 클릭하면
var state = $('#moreMenu').css('display'); // state 변수에 ID가 moreMenu인 요소의 display의 속성을 '대입'
if(state == 'none'){ // state가 none 상태일경우
$('#moreMenu').show(); // ID가 moreMenu인 요소를 show();
}else{
$('#moreMenu').hide(); // ID가 moreMenu인 요소를 hide();
}
});
});
</script>
<style>
#moreMenu{display:none}
</style>
<div id="toggleButton">숨기기/보이기1</div>
<div id="moreMenu">....1</div>
이것을 적용했어요~ 그런데..
목록 젤 위에 것만 토글이 되구 나머지는 먹통이예요
id가 아닌 클래스로 줬더니 펼칠때 전체목록의 내용 모두가 펼쳐지더라구요..
변수를 지정해야 할거 같은데 어떻게 해야할까요?
현재는
<tr class="<?php if ($list[$i]['is_notice']) echo "bo_notice"; ?>" id="toggleButton">
<td class="td_subject" id="moreMenu"><?php echo $list[$i]['content'] ?></td>
이렇게 되어있어요~
도움 부탁드립니다~
답변 1
위처럼 풀어쓰기 어려우시면 function 으로 하는 방법을 추천드립니다.
id="toggleButton" 대신 onclick="펼치기(번호)" 방식으로 하면 쉽지 않을가요?
이미 짜여져있는 html이 아니구 목록이 계속해서 신규 생성이 되어서요...ㅜㅜ
