개발은 핵찜이야/JQUERY
[Jquery] 탭메뉴 페이지 새로고침시 현재탭 유지
주인정
2015. 2. 24. 11:01
[문제]
DOM 에서 탭메뉴로 페이지 구성시 새로고침을 하게되면 첫번째 탭메뉴 페이지가 나오는 문제
[해결]
$(document).ready(function(){
var link = document.location.href; //현재 접속 url
var tab = link.split('/').pop(); //배열의 맨 마지막 요소를 삭제하고 삭제된 해당 값을 반환함
$('a[href$='+tab+']').trigger("click"); //해당 앵커 트리거를이용 클릭 이벤트
});
<ul>
<li><a href="#1">Link one</a></li>
<li><a href="#2">Link two</a></li>
<li><a href="#3">Link three</a></li>
<li><a href="#4">Link four</a></li>
</ul>
4번째 탭메뉴를 클릭하면 http://url/#4 주소가 된다
새로고침시 접속 url 에서 마지막 세그먼트를 찾고 해당 앵커 트리거로 클릭 이벤트
끝~