목록으로

tab 메뉴 새로고침 유지 질문드립니다. 채택완료

mituhashi1218

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2년 전 조회 2,204

답변 2

<div>

</li>

</li>

</li>

</li>

</div>

</ul>

</li>

</li>

</li>

</li>

$('.tabs li').click(function(){

var data = $(this).attr('data-tab');

$('.tabs-pannel > li').removeClass('active')

$('#'+data).addClass('active');

});

const items = document.querySelectorAll(".tabs li");

items.forEach((item)=>{

item.addEventListener('click',()=>{

items.forEach((e)=>{

e.classList.remove('active');

})

item.classList.add('active');

})

</script>

현재 이런 구조로 탭 메뉴를 사용중입니다! 그런데 메뉴에 id 값을 줘도 새로고침시 첫번째 페이지로 돌아가는데 방법이 있을까요?

#그누보드5 #탭메뉴

답변 2개

정렬:

채택된 답변

+20 포인트

킹콩랩스

프로필 보기 이 회원 글보기 이 회원의 댓글보기

2년 전

Copy





 



.tabs li.active{border: 1px solid red;}

.tabs-pannel li{display: none;}

.tabs-pannel li.active{display: block;}





    

        1

    

    

        2

    

    

        3

    

    

        4

    



 



    내용1

    내용2

    내용3

    내용4



 



// 탭변경

$('.tabs li').click(function(){

    var eq = $(this).index();

    $('.tabs li').removeClass('active').eq(eq).addClass('active');

    $('.tabs-pannel li').removeClass('active').eq(eq).addClass('active');

});

 

// 새로고침 유지

var eq = window.location.href.split('-').pop();

if( eq > 0 ){

    eq--;

    $('.tabs li').eq(eq).click();

}

로그인 후 평가할 수 있습니다