>웹 프론트엔드 >JS 튜토리얼 >저장되지 않은 변경 사항에 대한 OnBeforeUnload 대화 상자를 어떻게 개선할 수 있습니까?

저장되지 않은 변경 사항에 대한 OnBeforeUnload 대화 상자를 어떻게 개선할 수 있습니까?

Barbara Streisand
Barbara Streisand원래의
2024-12-15 11:44:18681검색

How Can I Improve the OnBeforeUnload Dialog for Unsaved Changes?

OnBeforeUnload 대화 상자 사용자 정의: 포괄적인 솔루션

onbeforeunload 이벤트는 페이지를 떠나기 전에 사용자에게 저장되지 않은 변경 사항에 대해 경고하는 중요한 도구입니다. 그러나 이 이벤트에 의해 표시되는 기본 대화 상자는 최적이 아닐 수 있으므로 사용자 정의가 필요합니다. 불행하게도 기본 대화 상자를 수정하는 것은 불가능합니다.

해결책: 제한 내에서 작업하기

기존 대화 상자로 작업하려면 창의 returnValue 속성에 문자열을 할당하세요. .event:

window.onbeforeunload = function() {
    return 'You have unsaved changes!';
}

추가 참고사항 jQuery

  • onbeforeunload에 jQuery의 이벤트 핸들러를 사용하지 마세요. 여러 이벤트가 발생할 수 있습니다.
  • jQuery를 사용하는 경우 일반 바인딩 구문을 사용하세요.
$(window).bind('beforeunload', function() {} );

맞춤 메시지 Chrome

onbeforeunload 대화 상자의 맞춤 메시지는 Chrome 버전 51부터 더 이상 사용되지 않습니다.

결론

onbeforeunload 대화 상자는 사용할 수 없지만 완벽하게 맞춤화되어 있는 이러한 솔루션은 사용자 경험을 향상시키고 저장되지 않은 데이터에 대한 중요한 정보를 전달하는 효과적인 방법을 제공합니다. 변경됩니다.

위 내용은 저장되지 않은 변경 사항에 대한 OnBeforeUnload 대화 상자를 어떻게 개선할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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