페이지를 닫을 때(남기지 않을 때) 언로드하기 전에 jquery?

페이지를 닫을 때(남기지 않을 때) 언로드하기 전에 jquery?

"페이지를 나가시겠습니까?"를 표시하려면 어떻게 해야 합니까?사용자가 실제로 페이지를 닫으려고 할 때(브라우저 창 또는 탭에서 X 단추 클릭) 페이지에서 벗어나 탐색하려고 할 때(다른 링크 클릭)가 아닙니다.

사용자가 페이지를 닫으려고 할 때 클라이언트가 "페이지를 나가시겠습니까?"라는 메시지를 표시하려고 합니다.쇼핑 카트에는 아직 아이템이 있습니다."

불행하게도$(window).bind('beforeunload')사용자가 페이지를 닫을 때만 실행되지 않습니다.

jQuery:

function checkCart() { 
  $.ajax({
    url : 'index.php?route=module/cart/check',
    type : 'POST',
    dataType : 'json',
    success : function (result) {
       if (result) {
        $(window).bind('beforeunload', function(){
          return 'leave?';
        });
       }
    }
  })
}

JQuery를 사용하여 이 작업을 수행할 수 있습니다.

예를 들어,

<a href="your URL" id="navigate"> click here </a>

당신의.JQuery될 것이다,

$(document).ready(function(){

    $('a').on('mousedown', stopNavigate);

    $('a').on('mouseleave', function () {
           $(window).on('beforeunload', function(){
                  return 'Are you sure you want to leave?';
           });
    });
});

function stopNavigate(){    
    $(window).off('beforeunload');
}

메시지 탈퇴 알림을 받으려면 다음과 같이 하십시오.

$(window).on('beforeunload', function(){
      return 'Are you sure you want to leave?';
});

$(window).on('unload', function(){

         logout();

});

이 솔루션은 모든 브라우저에서 작동하며 테스트해 보았습니다.

Ajax에 Javascript를 입력해 보십시오.

window.onbeforeunload = function(){
  return 'Are you sure you want to leave?';
};

참조 링크

예 2:

document.getElementsByClassName('eStore_buy_now_button')[0].onclick = function(){
    window.btn_clicked = true;
};
window.onbeforeunload = function(){
    if(!window.btn_clicked){
        return 'You must click "Buy Now" to make payment and finish your order. If you leave now your order will be canceled.';
    }
};

여기서는 사용자가 페이지를 나갈 때마다 단추를 클릭할 때까지 경고합니다.

데모: http://jsfiddle.net/DerekL/GSWbB/show/

크레딧은 여기에 있어야 합니다. 다운로드가 트리거되기 전에 window.on이 클릭되었을 때 링크를 감지하는 방법은 무엇입니까?

기본적으로 이 솔루션은 링크 또는 창이 언로드 이벤트를 발생시켰는지 여부를 탐지하는 수신기를 추가합니다.

var link_was_clicked = false;
document.addEventListener("click", function(e) {
   if (e.target.nodeName.toLowerCase() === 'a') {
      link_was_clicked = true;
   }
}, true);

window.onbeforeunload = function(e) {
    if(link_was_clicked) {
        return;
    }
    return confirm('Are you sure?');
}

여기 https://stackoverflow.com/a/1632004/330867, 에 표시된 것처럼 이 페이지의 종료 원인을 "수정"하여 이를 구현할 수 있습니다.

댓글에 언급된 것처럼, 다른 질문에 있는 코드의 새로운 버전은 다음과 같습니다. 여기에는 질문에 작성한 Ajax 요청도 포함됩니다.

var canExit = true;

// For every function that will call an ajax query, you need to set the var "canExit" to false, then set it to false once the ajax is finished.

function checkCart() {
  canExit = false;
  $.ajax({
    url : 'index.php?route=module/cart/check',
    type : 'POST',
    dataType : 'json',
    success : function (result) {
       if (result) {
        canExit = true;
       }
    }
  })
}

$(document).on('click', 'a', function() {canExit = true;}); // can exit if it's a link
$(window).on('beforeunload', function() {
    if (canExit) return null; // null will allow exit without a question
    // Else, just return the message you want to display
    return "Do you really want to close?";
});

중요:전역 변수를 정의해서는 안 됩니다(여기).canExit), 간단한 버전을 위해 여기에 있습니다.

확인 메시지를 완전히 무시할 수는 없습니다(적어도 크롬에서는).반환되는 메시지는 Chrome에서 제공하는 메시지에만 추가됩니다.이유: OnBeforeUnload 대화상자를 재정의하고 내 대화상자로 바꾸려면 어떻게 해야 합니까?

다음을 통해 데이터 로드ajax반품 전표를 통해 표시합니다.

<script type="text/javascript">
function closeWindow(){

    var Data = $.ajax({
        type : "POST",
        url : "file.txt",  //loading a simple text file for sample.
        cache : false,
        global : false,
        async : false,
        success : function(data) {
            return data;
        }

    }).responseText;


    return "Are you sure you want to leave the page? You still have "+Data+" items in your shopping cart";
}

window.onbeforeunload = closeWindow;
</script>

여기 코드에서 사용할 수 있는 기능이 있습니다.

function setProcessing(isProcessing) {
  $(window).on('beforeunload', function(event) {
    if (isProcessing) {
      event.preventDefault();
      return '';
    }
  });
}

setProcessing(true) 또는 setProcessing(false)만 설정합니다.

시도할 수 있습니다.onbeforeunload사건의

이것도 좀 보세요

대화 상자가 1초 동안 실행되고 사라집니까?

언급URL : https://stackoverflow.com/questions/18783535/jquery-beforeunload-when-closing-not-leaving-the-page