javascript 쿠키를 사용해서 스크롤 유지

function setCookie(cookieName, value, exdays){
	var exdate = new Date();
	exdate.setDate(exdate.getDate() + exdays);
	var cookieValue = escape(value) + ((exdays==null) ? "" : "; expires=" + exdate.toGMTString());
	document.cookie = cookieName + "=" + cookieValue;
}

function deleteCookie(cookieName){
	var expireDate = new Date();
	expireDate.setDate(expireDate.getDate() - 1);
	document.cookie = cookieName + "= " + "; expires=" + expireDate.toGMTString();
}

function getCookie(cookieName) {
	cookieName = cookieName + '=';
	var cookieData = document.cookie;
	var start = cookieData.indexOf(cookieName);
	var cookieValue = '';
	if(start != -1){
		start += cookieName.length;
		var end = cookieData.indexOf(';', start);
		if(end == -1)end = cookieData.length;
		cookieValue = cookieData.substring(start, end);
	}
	return unescape(cookieValue);
}

-> 쿠키를 세팅하고 삭제하고 불러오는 함수들을 추가한다.

 

 
 function frm_submit(){
 	//스크롤 위치 저장
 	var scrollPoint = (document.documentElement && document.documentElement.scrollTop) 
		|| document.body.scrollTop;

	setCookie("category", "mainScrollPoint"); // 쿠키에서 사용할 category에 사용자 정의 카테고리명 세팅
	setCookie("scrollPoint", scrollPoint); // 쿠키에 스크롤 위치 세팅

	$("#frm").submit();
}

-> 다양한 이벤트 상황에서 사용 가능하지만 같은 페이지에서 검색 이후 스크롤 유지를 위해 검색폼 submit 시 스크롤의 위치를 변수에 저장하고 쿠키를 불러올 때 참조할 category 및 변수 명을 쿠키에 세팅한다.

 

 
 var category = getCookie("category"); //setCookie("category")로 세팅한 category 변수 명
 var scrollPoint = getCookie("scrollPoint"); //setCookie("scrollPoint")로 세팅한 스크롤 위치
 var currentCategory = "mainScrollPoint"; //이벤트 발생 후 새로 로드된 현재 페이지의 카테고리 지정
 
 if (category != "" && category != 'undefined' 
	&& category == currentCategory && scrollPoint != "" && scrollPoint != 'undefined') {
    
 	window.scroll(0, scrollPoint); 
 	//body.scrollTop(scrollPoint);
 }

// 쿠키 삭제
deleteCookie("category"); //또는 setCookie("category", "");
deleteCookie("scrollPoint"); //또는 setCookie("scrollPoint", "");

-> submit 이전에 세팅한 스크롤 위치 값으로 현재 페이지의 스크롤 값을 설정하고 쿠키를 삭제한다.