브라우저의 뒤로가기 버튼 이벤트 케치 Back Forward Cache

 

submit후 브라우저 자체의 뒤로 가기 버튼을 클릭할 경우 Back Forward Cache에 의해 이전 화면의 input, checkbox

등이 체크된 상태 그대로 남아 있다.

 

하지만 input 박스의 이벤트 등은 다시 호출되지 않기에 계산식은 동작을 하지 않아 입력 값과

계산 금액이 맞지 않았다.

 

728x90

반응형

SMALL

이런 경우 아래와 같이 해당 페이지에서  Back Forward Cache 관련 이벤트들을 잡아 계산 로직도 실행될 수 있도록

input테그에 이벤트를 강제로 trigger 시켜주자. 

window.onpageshow = function(event) {
// Back Forward Cache로 브라우저가 로딩될 경우 혹은 브라우저 뒤로가기 했을 경우
    if ( event.persisted || (window.performance && window.performance.navigation.type == 2)) {
    	//페이지 내용이 다시 계산 될 수 있도록 이벤트를 호출 한다.
    	$('.js_countInp_cart').trigger('change');
    }
}

 

출처:

https://web.dev/bfcache/

캐시 뒤로/앞으로