>웹 프론트엔드 >JS 튜토리얼 >'페이지 나가기'를 구현하는 방법은 무엇입니까? 기존 브라우저에 확인 메시지가 표시되나요?

'페이지 나가기'를 구현하는 방법은 무엇입니까? 기존 브라우저에 확인 메시지가 표시되나요?

Barbara Streisand
Barbara Streisand원래의
2024-12-12 21:09:10840검색

How to Implement a

"이 페이지에서 나가시겠습니까?" 메시지를 표시하는 방법 기존 브라우저에서 저장되지 않은 변경 사항에 대한 메시지 표시

소개

웹 페이지에서 텍스트 편집이나 기타 변경 사항을 적용하고 페이지에서 다른 곳으로 이동하려고 하면 브라우저에 확인 메시지가 표시될 수 있습니다. 사용자에게 탐색 확인을 요청하는 메시지가 표시됩니다. 이 기능은 사용자가 저장되지 않은 변경 사항을 실수로 잃어버리는 것을 방지하는 데 유용합니다.

프롬프트 활성화

기존 브라우저(IE6-8, Firefox 이전)에서 이 탐색 확인 프롬프트를 활성화하려면 버전 4), window.onbeforeunload 속성에 함수를 할당합니다. 참조:

window.onbeforeunload = function(e) {
  // For IE6-8 and Firefox prior to version 4
  if (e) {
    e.returnValue = "Are you sure you want to leave?";
  }

  // For Chrome, Safari, IE8+ and Opera 12+
  return "Are you sure you want to leave?";
};

프롬프트 비활성화

탐색 확인 프롬프트를 비활성화하려면 window.onbeforeunload에서 함수 참조를 제거하십시오:

window.onbeforeunload = null;

저장되지 않은 항목 확인 중 변경 사항

페이지에 저장되지 않은 변경 사항이 있는지 여부에 관계없이 사용자 확인이 트리거됩니다. 저장되지 않은 변경 사항을 확인하려면 선호하는 유효성 검사 프레임워크나 사용자 정의 솔루션을 활용하면 됩니다.

예를 들어 jQuery를 사용하면 필드에 비변경 사항이 포함된 경우 window.onbeforeunload를 설정하기 위해 jQuery를 사용하여 변경 이벤트를 양식 필드에 바인딩할 수 있습니다. -빈 값:

$('input').change(function() {
  if($(this).val() != "") {
    window.onbeforeunload = "Are you sure you want to leave?";
  }
});

참고:

최신 브라우저에서는 사용자 정의 탐색 확인 메시지를 표시하는 것은 보안 위험으로 간주되어 제거되었습니다. 이제 브라우저는 일반 메시지만 표시합니다. 최신 브라우저에서 탐색 프롬프트를 활성화하거나 비활성화하려면 반환 값 없이 함수 참조에 대해 window.onbeforeunload를 설정하거나 제거하기만 하면 됩니다.

위 내용은 '페이지 나가기'를 구현하는 방법은 무엇입니까? 기존 브라우저에 확인 메시지가 표시되나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.