JS에서 페이지를 언로딩(이동)하지 못하게 하려면 어떻게 해야 합니까?

JS에서 페이지를 언로딩(이동)하지 못하게 하려면 어떻게 해야 합니까?

페이지가 다시 로드되거나 탐색되지 않게 하는 방법을 아는 사람이 있습니까?

jQuery(함수($) {
/* 글로벌 언로드 시 알림 */경고 = true;
if(경고) {$($).π", 함수 {if (확인 ("이 페이지를 떠나시겠습니까?") == true) {//확인을 눌렀습니다.alert(ok');} 기타 {// 그들은 Cancel을 눌렀습니다.alert(')');거짓을 반환합니다.}});}});

저는 현재 전자상거래 사이트에서 업무를 보고 있는데, 향후 주문 내용을 보여주는 페이지에는 +/- 버튼을 이용하여 주문한 수량을 변경할 수 있는 기능이 있습니다.이렇게 수량을 변경하는 것은 실제로 주문 자체를 변경하는 것이 아니라 확인을 눌러야 주문을 변경할 수 있습니다.

그러나 수량을 변경하여 페이지에서 다른 곳으로 이동하는 경우, 페이지에서 다른 곳으로 이동하거나 이동할 경우 변경된 수량이 손실되므로 사고가 발생할 경우 이를 경고하고 싶습니다.

위의 코드에서 저는 기본적으로 false인 전역 변수를 사용하고 있습니다(테스트 시에만 해당됨). 수량이 변경되면 이 변수를 true로 업데이트하고 변경 사항이 확인되면 false로 설정합니다.

경고가 사실이고 페이지가 언로딩되면 확인란을 제공하고, 만약 그들이 거절한다면 이 페이지에 남아있고 싶다고 하면 저는 그 페이지가 언로딩되는 것을 막아야 합니다.return false가 작동하지 않지만 여전히 사용자가 탐색할 수 있습니다(알림은 디버깅용으로만 제공됨).

무슨 생각 있어요?

onbeforeunload는 사용자가 원하는 것입니다. 함수는 "Event 개체의 returnValue 속성에 문자열 값을 할당하고 동일한 문자열을 반환해야 합니다."자세한 내용은 Microsoft 및 Mozilla의 문서를 확인하십시오.

사용자가 반환하는 문자열은 브라우저가 사용자에게 사용자 정의 확인 상자를 제공하는 데 사용되며, 사용자가 선택할 경우 사용자가 사용자 정의 확인 상자에 머무르기를 거부할 수 있습니다.악의적인 스크립트가 브라우저 거부 공격을 야기하는 것을 방지하려면 이 방법을 사용해야 합니다.

이 코드는 나탈리의 제안에 따라 경고하지만, 페이지의 양식이 제출된 경우 경고를 비활성화합니다.JQuery를 사용합니다.

var warning = true;
window.onbeforeunload = function() { 
  if (warning) {
    return "You have made changes on this page that you have not yet confirmed. If you navigate away from this page you will lose your unsaved changes";
  }
}

$('form').submit(function() {
   window.onbeforeunload = null;
});

언로드 이벤트를 실행하기 전에 on을 사용합니다.

window.onbeforeunload = confirmExit;
function confirmExit()
{
    return "You have attempted to leave this page.  If you have made any changes to the fields without clicking the Save button, your changes will be lost.  Are you sure you want to exit this page?";
}

window.onbeforeunload = function() { 
  if (warning) {
    return `You have made changes on this page that you have not yet confirmed. 
    If you navigate away from this page you will lose your unsaved changes`;
  }
}

크롬, 사파리 및 오페라에서는 지원되지 않음

이 코멘트에서 말했듯이, jQuery에서 어떤 것도 구속되지 않습니다.beforeunload이벤트성의

@karim79: 아니 그렇지 않습니다.jQuery에는 언로드 전 함수에 바인딩되는 것이 없습니다. "언로드"는 "언로드" 이벤트에 바인딩됩니다.내 말을 못 믿겠으면 출처를 검색하세요 ;-) – Nick Fitz

따라서 함수를 에 바인딩하려면 순수 자바스크립트를 사용해야 합니다.beforeunload이벤트성의

var warning = true;
$("form").submit(function() {
  warning = false;
});
$('#exit').click(function() {
  window.location.replace('https://stacksnippets.net/js')
});
window.onbeforeunload = function() {
  if(warning) {
    return true;
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<form>
<input type="submit">
</form>

이거 먹어봐요.

    window.addEventListener('beforeunload', function (event) {
      event.preventDefault();

      event.returnValue = 'Are you sure you want to leave this page?';
    });

를 사용해 .e.preventDefault()거짓으로 답하는 대신에'e'가 콜백 언로드의 첫 번째 인수가 될 것입니다.

언급URL : https://stackoverflow.com/questions/1299452/how-do-i-stop-a-page-from-unloading-navigating-away-in-js