활성화된 버튼별로 원하는 줄만 출력하려고 합니다..
본문
위와 같이 1~3번 버튼이 있고 제일 처음에는 1~3 버튼만 보이고
1번 버튼을 누르면 1번에 포함된 2개 줄이 나오고
2번 버튼을 누르면 1번 줄은 숨겨지고 2번 줄이 나오게 하려면 어떻게 해야될 까요..
tr td가 여러개라 어떻게 해야될지... 도와주세요
답변 2
<table border=1>
<tr class='c1' style='display:none'>
<td>1-1-1</td><td>1-1-2</td><td>1-1-3</td>
</tr>
<tr class='c1' style='display:none'>
<td>1-2-1</td><td>1-2-2</td><td>1-2-3</td>
</tr>
<tr class='c2' style='display:none'>
<td>2-1-1</td><td>2-1-2</td><td>2-1-3</td>
</tr> <tr class='c2' style='display:none'>
<td>2-2-1</td><td>2-2-2</td><td>2-2-3</td>
</tr>
<tr class='c3' style='display:none'>
<td>3-1-1</td><td>3-1-2</td><td>3-1-3</td>
</tr> <tr class='c3' style='display:none'>
<td>3-2-1</td><td>3-2-2</td><td>3-2-3</td>
</tr>
</table>
<button class='btn' showTr='c1'>버튼1</button>
<button class='btn' showTr='c2'>버튼2</button>
<button class='btn' showTr='c3'>버튼3</button>
<script>
$(".btn").click(function(){
var showTr = $(this).attr("showTr");
$('tr').hide();
$("."+showTr).show(); // 선택된것만 보이게
});
</script>
css나 js로 탭메뉴로 하시면 되실것 같은데요~
젤 처음 줄들은 display:none으로 모두 숨겨놓으시구요~
답변을 작성하시기 전에 로그인 해주세요.
