====== 메뉴 클릭시 이벤트 발생 ======
* description : jstl 메뉴 클릭시 이벤트 발생시키기
* author : 천호동밤안개
* email : jhgong@repia.com
* lastupdate : 2020-02-15
===== function =====
○ 메뉴 클릭시 해당 Navigation bar를 HighLighting 시키려면 다음과 같은 방식을 사용한다.
setNavigation();
// 메뉴 클릭시 이벤트 발생
$("ul.snb li a").on('click', function() {
$(this).parent().siblings().children('a').removeClass('on');
$(this).addClass('on');
/* 추가 작업 */
}
○ 만약 URL이 바뀌어서 해당 디렉토리 안에 있을 때 HighLighting을 유지할수 없는 경우
var path = window.location.pathname;
path = path.replace(/\/$/, "");
path = decodeURIComponent(path);
/* contextRoot */
var endIdx = path.indexOf('/', 1);
var contextRoot = path.substring(0, endIdx); // contextRoot
var depth1Root = path.substring(0, endIdx); // 1-th Root
if(path.indexOf('/', contextRoot.length + 1)>=0)
{
endIdx = path.indexOf('/', contextRoot.length + 1);
depth1Root = path.substring(0, endIdx);
}
// console.log(path, contextRoot, depth1Root);
// console.log(path);
$("ul.snb li a").each(function() {
var href = $(this).attr('href');
// console.log(href);
if(href.indexOf(depth1Root)===0)
{
$(this).addClass('on');
}
}
○ 이와같이 ' **indexOf** ' 혹은 ' **lastIndexOf** ' 를 사용해 적절하게 URL을 수정하는 방식을 사용한다.
{{tag>천호동밤안개 jstl 이벤트발생}}