특수한 경우에 브라우저의 ‘뒤로 가기’ 버튼을 막아야 하는 상황이 있습니다. 물론 권장할 만한 것은 아니지만, 필요한 경우가 있으니까요.

Disable Back Button

위 버튼을 클릭하면 해시를 사용해서 ‘뒤로 가기’ 버튼으로 해시가 지워지면, 다시 해시가 추가되도록 처리하여 ‘뒤로 가기’ 버튼을 무력화 시켰습니다. 물론 ‘뒤로 가기’ 버튼을 오른큭릭 하여 이전 페이지로 넘어가는 것을 막을 수는 없습니다.
그리고 현재 페이지 내에서 #name을 사용한 화면 이동도 사용할 수 없게 됩니다. 뭐, 약간의 코드를 추가하면 되겠지만…

다음 소스를 통해서 간단히 적용할 수 있습니다.

1
2
3
4

history.pushState(null, null, "#noback");
$(window).bind("hashchange", function(){
  history.pushState(null, null, "#noback");
});