버튼별로 다른 클래스의 tr 항목을 숨기고 싶습니다.
본문
<div id="myDIV">
<button type="button" class="btn1" onclick="return showOrHide('menulink1');">1</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink2');">2</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink3');">3</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink4');">4</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink5');">5</button>
</div>
$(document).ready(function(){
$("button").click(function(){
$(".menulink1").toggle();
});
});
현재 위와 같은 소스로 했을 때 버튼을 눌리면 menulink1로 지정되어있는 tr 부분이 토글되긴한데
문제는 버튼별로 클래스가 다른 항목들을 토글 시키고 싶은데 2~5버튼을 눌려도 menulink1 클래스만
반응을 합니다..
버튼별로 클래스가 다른 항목을 토글 시키려면 어떻게 수정해줘야 될까요..
답변 2
<div id="myDIV">
<button type="button" class="btn1" onclick="return showOrHide('menulink1');">1</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink2');">2</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink3');">3</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink4');">4</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink5');">5</button>
</div>
<script>
// $(document).ready(function(){
// $("button").click(function(){
// $(".menulink1").toggle();
// });
// });
function showOrHide(menu){
$("."+menu+"").toggle();
}
</script>
요렇게 해보세요
$(".menulink1").toggle();
대신
$(this).toggle();