Phát hiện đóng trình duyệt hoặc tab


306

Có mã JavaScript / jQuery trình duyệt chéo nào để phát hiện nếu trình duyệt hoặc tab trình duyệt đang bị đóng, nhưng không phải do liên kết được nhấp không?


1
Xem câu trả lời của tôi cho câu hỏi này: stackoverflow.com/questions/3735198/ từ
Nivas


Sử dụng sessionStorage Tài sản, nó sẽ hết hạn khi đóng trình duyệt. w3schools.com/jsref/prop_win_sessionst
Storage.asp

Kiểm tra câu trả lời này! Tôi thấy nó cực kỳ hữu ích và bao gồm phần lớn các trường hợp. stackoverflow.com/a/26275621/7192927
SukanyaPai

Câu trả lời:


273

Nếu tôi hiểu đúng về bạn, bạn muốn biết khi nào một tab / cửa sổ được đóng một cách hiệu quả. Chà, AFAIK cách duy nhất Javascriptđể phát hiện loại nội dung đó là onunload& onbeforeunloadsự kiện.

Thật không may (hoặc may mắn thay?), Những sự kiện đó cũng được kích hoạt khi bạn rời khỏi một trang web qua linknút quay lại trình duyệt của bạn. Vì vậy, đây là câu trả lời tốt nhất tôi có thể đưa ra, tôi không nghĩ bạn có thể phát hiện một cách thuần túy closetrong Javascript. Sửa lỗi cho tôi nếu tôi sai ở đây.


39
Chính xác. Bạn chỉ có thể phát hiện khi trang được tải, không phải khi cửa sổ được đóng lại. Ngoài ra, onb Beforeunload không chuẩn, vì vậy nó không được tất cả các trình duyệt hỗ trợ.
Guffa

7
Tôi cũng muốn sử dụng tính năng 'đóng', nhưng nhận thấy rằng người dùng của tôi đôi khi sẽ làm mới màn hình bằng cách nhấn F5. Vì các trình xử lý 'đóng gần' của tôi được gọi khi làm mới như vậy, điều này có nghĩa là tôi không thể sử dụng nó theo cách tôi cần (đó là 'tab đóng hoặc cửa sổ' thực sự), chúng tôi cần một mô hình sự kiện mới cho tất cả những điều này
Jeach

1
Không còn hoạt động trên chrome / opera ... chromestatus.com/feature/5349061406228480
Seetal Samir

2
Tất nhiên điều này vẫn sẽ hoạt động, họ chỉ cần loại bỏ một Stringgiá trị trả lại tùy chỉnh từ onbeforeunload. Vì vậy, bây giờ bạn không còn có thể hiển thị một thông báo tùy chỉnh trước khi dỡ tải.
jAndy

@jAndy @Guffa Làm thế nào tôi có thể tìm ra cửa sổ nào bị bắn unload?
Egor Dudyak

125

Từ Tài liệu Firefox

Vì một số lý do, các trình duyệt dựa trên Webkit không tuân theo thông số kỹ thuật cho hộp thoại. Một ví dụ gần như làm việc chéo sẽ gần với ví dụ dưới đây.

window.addEventListener("beforeunload", function (e) {
  var confirmationMessage = "\o/";

  (e || window.event).returnValue = confirmationMessage; //Gecko + IE
  return confirmationMessage;                            //Webkit, Safari, Chrome
});

Ví dụ này để xử lý tất cả các trình duyệt.


2
Đây là giải pháp duy nhất hoạt động cho trình duyệt chrome của tôi. Tôi đã không thử bất kỳ người khác.
Chase Roberts

4
yee, tôi đã thử rất nhiều giải pháp và cuối cùng tôi sẽ đưa ra giải pháp này, kết hợp để có câu trả lời hay nhất và tôi kiểm tra nó trên tất cả các trình duyệt.
mohamed-ibrahim

1
Phương pháp này không hoạt động hoàn hảo trên tab đóng trong khi sử dụng firefox (> = ver. 44) chỉ với tab được mở.
Rajkishore

Kể từ hôm nay, sử dụng tất cả các phiên bản trình duyệt mới nhất, nhắc nhở hoạt động khi đóng tab, điều hướng đi hoặc đóng trình duyệt cho Chrome, Firefox, Opera, IE11 và Edge và cũng hoạt động khi bạn mở nhiều tab trừ Chrome nơi Chrome đóng tất cả các tab mà không cần nhắc, ít nhất là trên máy của tôi.
Thierry

không đưa ra một cách thích hợp như được định nghĩa trong câu hỏi. Điều này cũng kích hoạt sự kiện rời trang không chỉ đóng trình duyệt hoặc đóng tab
Sunil Acharya

48

Giải pháp đơn giản

window.onbeforeunload = function () {
    return "Do you really want to close?";
};

7
Những loại ma thuật này là? (y) nó có hoạt động trên tất cả các trình duyệt không? hoạt động tuyệt vời trên chrome
Ziv Weissman

5
nó kích hoạt khi bạn làm mới trang. đó là vấn đề duy nhất của tôi
Leo Leoncio

6
Giải pháp này không còn nữa trên Firefox và Chrome
Mehdi Dehghani

Điều này cũng kích hoạt sự kiện rời trang không chỉ đóng trình duyệt hoặc đóng tab
Sunil Acharya

20
<body onbeforeunload="ConfirmClose()" onunload="HandleOnClose()">

var myclose = false;

function ConfirmClose()
{
    if (event.clientY < 0)
    {
        event.returnValue = 'You have closed the browser. Do you want to logout from your application?';
        setTimeout('myclose=false',10);
        myclose=true;
    }
}

function HandleOnClose()
{
    if (myclose==true) 
    {
        //the url of your logout page which invalidate session on logout 
        location.replace('/contextpath/j_spring_security_logout') ;
    }   
}

// Điều này đang hoạt động trong IE7, nếu bạn đang đóng tab hoặc trình duyệt chỉ có một tab


2
ya nhưng đối với nhiều trình duyệt tab như eg8, firefox. Có vấn đề gì khi sử dụng cái này?
cometta

Hóa ra, việc sử dụng mã này trong IE9 sẽ khiến thông báo này bật lên khi người dùng nhấp vào nút quay lại, chuyển tiếp hoặc làm mới bằng chuột.
Steve Wortham

Chỉ cần đề cập rằng chúng tôi đã triển khai một giải pháp tương tự vào năm 2007. Giải pháp này không còn hoạt động trong IE9 kể từ khoảng một tuần trước. Nó đã ngừng hoạt động (hoặc có thể không bao giờ hoạt động) trong các trình duyệt được gắn thẻ từ lâu.
tjfo

Tôi đã tiêm window.onunload = "alert('wait')"window.onbeforeunload = "alert('wait... chrome!')"sử dụng bảng điều khiển trong Chromium / Ubuntu nhưng không được kích hoạt khi tôi đóng tab.
icedwater

window.onunload = "alert('wait')"và như vậy không nên làm việc thực sự. "Hàm sẽ gán một giá trị chuỗi cho thuộc tính returnValue của đối tượng Event và trả về cùng một chuỗi". Xin hãy xem bài viết của MDN
Dmitry Vyprichenko

8

Tôi cần tự động đăng xuất người dùng khi trình duyệt hoặc tab đóng, nhưng không phải khi người dùng điều hướng đến các liên kết khác. Tôi cũng không muốn một dấu nhắc xác nhận hiển thị khi điều đó xảy ra. Sau khi vật lộn với điều này một thời gian, đặc biệt là với IE và Edge, đây là những gì tôi đã kết thúc (đã kiểm tra làm việc với IE 11, Edge, Chrome và Firefox) sau khi dựa vào cách tiếp cận bằng câu trả lời này .

Đầu tiên, bắt đầu đồng hồ đếm ngược trên máy chủ trong beforeunloadtrình xử lý sự kiện trong JS. Các cuộc gọi ajax cần phải được đồng bộ hóa để IE và Edge hoạt động bình thường. Bạn cũng cần sử dụng return;để ngăn hộp thoại xác nhận hiển thị như thế này:

    window.addEventListener("beforeunload", function (e) {        
      $.ajax({
          type: "POST",
          url: startTimerUrl,
          async: false           
      });
      return;
    });

Bắt đầu bộ hẹn giờ đặt cancelLogoutcờ thành false . Nếu người dùng làm mới trang hoặc điều hướng đến một liên kết nội bộ khác, cancelLogoutcờ trên máy chủ được đặt thành đúng . Khi sự kiện hẹn giờ trôi qua, nó sẽ kiểm tra cancelLogoutcờ để xem sự kiện đăng xuất đã bị hủy chưa. Nếu bộ định thời đã bị hủy, thì nó sẽ dừng bộ hẹn giờ. Nếu trình duyệt hoặc tab bị đóng, thì cancelLogoutcờ sẽ vẫn sai và trình xử lý sự kiện sẽ đăng xuất người dùng.

Lưu ý thực hiện: Tôi đang sử dụng ASP.NET MVC 5 và tôi đang hủy đăng xuất theo Controller.OnActionExecuted()phương thức ghi đè .


Điều này đã làm việc tuyệt vời. Có một lý do nào khiến bạn thực hiện "async: false" không? Điều này tạo ra các cảnh báo rằng các cuộc gọi AJAX đồng bộ không được chấp nhận. Cảm ơn!
cat_in_hat 16/07/18

1
@FoundWaldoException, như đã lưu ý trong câu trả lời, tôi thấy rằng async cần phải được đặt thành false để điều này hoạt động trong IE và Edge.
Ionia316

Làm thế nào để hủy đăng xuất OnActionExecuted?
Kiquenet

@Kiquenet Chỉ cần dừng bộ đếm thời gian đã được bắt đầu trong mã của bạn.
Ionia316

6

Xin lỗi, tôi không thể thêm nhận xét vào một trong những câu trả lời hiện có, nhưng trong trường hợp bạn muốn thực hiện một loại hộp thoại cảnh báo, tôi chỉ muốn đề cập rằng bất kỳ hàm xử lý sự kiện nào cũng có đối số - sự kiện. Trong trường hợp của bạn, bạn có thể gọi event.preventDefault () để không cho phép tự động rời khỏi trang, sau đó đưa ra hộp thoại của riêng bạn. Tôi coi đây là một lựa chọn tốt hơn so với việc sử dụng cảnh báo xấu xí và không an toàn (). Cá nhân tôi đã triển khai bộ hộp thoại của riêng mình dựa trên đối tượng kendoWindow (Giao diện người dùng Kendo của Telerik, gần như có nguồn mở hoàn toàn, ngoại trừ kendoGrid và kendoEditor). Bạn cũng có thể sử dụng các hộp thoại từ jQuery UI. Mặc dù vậy, xin lưu ý rằng những thứ như vậy không đồng bộ và bạn sẽ cần liên kết một trình xử lý với sự kiện onclick của mỗi nút, nhưng điều này khá dễ thực hiện.

Tuy nhiên, tôi đồng ý rằng việc thiếu sự kiện gần gũi thực sự là khủng khiếp: ví dụ, nếu bạn muốn đặt lại trạng thái phiên của mình ở phía sau chỉ trong trường hợp đóng thực sự, đó là một vấn đề.


6

Đối với các tác vụ tương tự, bạn có thể sử dụng sessionStorageđể lưu trữ dữ liệu cục bộ cho đến khi tab trình duyệt được đóng.

Đối sessionStoragetượng chỉ lưu trữ dữ liệu cho một phiên (dữ liệu sẽ bị xóa khi tab trình duyệt bị đóng). ( W3Schools )

Đây là cây bút của tôi .

<div id="Notice">
    <span title="remove this until browser tab is closed"><u>dismiss</u>.</span>
</div>
<script>
    $("#Notice").click(function() {
     //set sessionStorage on click
        sessionStorage.setItem("dismissNotice", "Hello");
        $("#Notice").remove();
    });
    if (sessionStorage.getItem("dismissNotice"))
    //When sessionStorage is set Do stuff...
        $("#Notice").remove();
</script>

5

Không có sự kiện, nhưng có một thuộc tính window.closedđược hỗ trợ trong tất cả các trình duyệt chính tại thời điểm viết bài này. Do đó, nếu bạn thực sự cần biết bạn có thể thăm dò cửa sổ để kiểm tra tài sản đó.

if(myWindow.closed){do things}

Lưu ý: Bỏ phiếu bất cứ điều gì thường không phải là giải pháp tốt nhất. Sự window.onbeforeunloadkiện này nên được sử dụng nếu có thể, cảnh báo duy nhất là nó cũng kích hoạt nếu bạn điều hướng đi.


4
$(window).unload( function () { alert("Bye now!"); } );

9
Điều này sẽ không hoạt động trên Firefox hoặc Chrome. Hãy thử beforeunloadnếu muốn hiển thị một cảnh báo. Như thế này:$(window).on('beforeunload', function(){ alert ('Bye now')});
AdrianoRR

5
theo tài liệu jQuery "Hầu hết các trình duyệt sẽ bỏ qua các cuộc gọi đến alert (), confirm () và kịp thời ()" api.jquery.com/unload
katzmopolitan

4

Hãy thử sử dụng nó:

window.onbeforeunload = function (event) {
    var message = 'Important: Please click on \'Save\' button to leave this page.';
    if (typeof event == 'undefined') {
        event = window.event;
    }
    if (event) {
        event.returnValue = message;
    }
    return message;
};

$(function () {
    $("a").not('#lnkLogOut').click(function () {
        window.onbeforeunload = null;
    });
    $(".btn").click(function () {
        window.onbeforeunload = null;
});
});

3

Tôi tìm thấy một cách, hoạt động trên tất cả các trình duyệt của tôi .

Đã thử nghiệm trên các phiên bản sau: Firefox 57, Internet Explorer 11, Edge 41, một trong những Chrome mới nhất (nó sẽ không hiển thị phiên bản của tôi)

Lưu ý : onb Beforeunload sẽ kích hoạt nếu bạn rời khỏi trang theo bất kỳ cách nào có thể (làm mới, đóng trình duyệt, chuyển hướng, liên kết, gửi ..). Nếu bạn chỉ muốn nó xảy ra trên trình duyệt đóng, chỉ cần liên kết các trình xử lý sự kiện.

  $(document).ready(function(){         

        var validNavigation = false;

        // Attach the event keypress to exclude the F5 refresh (includes normal refresh)
        $(document).bind('keypress', function(e) {
            if (e.keyCode == 116){
                validNavigation = true;
            }
        });

        // Attach the event click for all links in the page
        $("a").bind("click", function() {
            validNavigation = true;
        });

        // Attach the event submit for all forms in the page
        $("form").bind("submit", function() {
          validNavigation = true;
        });

        // Attach the event click for all inputs in the page
        $("input[type=submit]").bind("click", function() {
          validNavigation = true;
        }); 

        window.onbeforeunload = function() {                
            if (!validNavigation) {     
                // ------->  code comes here
            }
        };

  });

Làm thế nào một trình xử lý riêng biệt cho trình duyệt đóng sẽ được thêm vào..Tôi không nghĩ rằng chúng tôi có sự kiện riêng biệt cho việc này.
blazehub

Điều này rất hữu ích. Tôi cần điều chỉnh neo A để chỉ bắn cho các siêu liên kết thực tế. Nếu không, việc nhấp vào các tab bootstrap đã làm hỏng nó: $ ("a [href! = '']"). Không ('[href ^ = "#"]'). Bind ("click", function ()
Ken Forslund

3

Vì chưa có ai đề cập đến nó (hơn 8 năm sau): WebSocket có thể là một cách hiệu quả khác để phát hiện một tab đóng. Miễn là tab được mở và chỉ vào máy chủ, máy khách có thể duy trì kết nối WebSocket hoạt động với máy chủ.

Hãy cẩn thận: Xin lưu ý rằng giải pháp này thực sự chỉ khả thi đối với một dự án nếu WebSocket không yêu cầu bất kỳ chi phí đáng kể nào khác từ những gì bạn đang làm.

Trong khoảng thời gian chờ hợp lý (ví dụ 2 phút), phía máy chủ có thể xác định rằng máy khách đã biến mất sau khi WebSocket bị ngắt kết nối và thực hiện bất kỳ hành động nào mong muốn như xóa các tệp tạm thời đã tải lên. (Trong trường hợp sử dụng cực kỳ chuyên biệt của tôi, mục tiêu của tôi là chấm dứt máy chủ ứng dụng localhost ba giây sau khi giọt kết nối WebSocket và tất cả chấm dứt hoạt động CGI / FastCGI -. Bất kỳ kết nối giữ-sống khác không ảnh hưởng đến tôi)

Tôi gặp vấn đề khi xử lý sự kiện onunload hoạt động đúng với đèn hiệu (theo khuyến nghị của câu trả lời này ). Đóng tab không xuất hiện để kích hoạt đèn hiệu và các tab mở đã kích hoạt nó theo những cách có khả năng gây ra sự cố. Một WebSocket đã giải quyết vấn đề mà tôi đang gặp phải một cách sạch sẽ hơn vì kết nối sẽ đóng khoảng thời gian mà tab đóng và chuyển các trang trong ứng dụng chỉ đơn giản là mở một kết nối WebSocket mới trong cửa sổ trễ.


2
vậy được rồi. Nhưng, bạn không thể chia sẻ bất kỳ mã hoặc thủ tục để xử lý nó? Không có điều đó đối với một người mới như tôi không thể hiểu được
P Satish Patro

Trên thực tế, tôi đã không rõ ràng trong bình luận đầu tiên của tôi. Tôi không biết ổ cắm web. Vì vậy, tôi chỉ muốn xem cách xử lý
P Satish Patro

1
Liên kết trong nhận xét của tôi ở trên đi đến một số ví dụ về mã WebSocket JS. Phần JS của máy khách là phần dễ dàng. Mã đó dành cho trường hợp sử dụng rất cụ thể của tôi mặc dù tôi cần chấm dứt toàn bộ máy chủ ứng dụng một cách kịp thời. Cách bạn viết một máy chủ WebSocket tùy thuộc vào bạn và yêu cầu cấu hình phía máy chủ để kết nối mọi thứ với nhau (rất nhiều người thích phần phụ trợ NodeJS w / Nginx frontend). Viết một máy chủ hỗ trợ TCP / IP là một chủ đề phức tạp không phù hợp để thảo luận trong các bình luận và việc thiết lập một vấn đề chỉ để phát hiện vấn đề cụ thể này là quá mức cần thiết.
CubicleSoft

2
//Detect Browser or Tab Close Events
$(window).on('beforeunload',function(e) {
  e = e || window.event;
  var localStorageTime = localStorage.getItem('storagetime')
  if(localStorageTime!=null && localStorageTime!=undefined){
    var currentTime = new Date().getTime(),
        timeDifference = currentTime - localStorageTime;

    if(timeDifference<25){//Browser Closed
       localStorage.removeItem('storagetime');
    }else{//Browser Tab Closed
       localStorage.setItem('storagetime',new Date().getTime());
    }

  }else{
    localStorage.setItem('storagetime',new Date().getTime());
  }
});

Liên kết JSFiddle

Xin chào tất cả, tôi đã có thể đạt được các lần nhấp 'Phát hiện sự kiện Trình duyệt và Đóng tab' bằng cách sử dụng bộ nhớ và dấu thời gian của trình duyệt. Hy vọng tất cả các bạn sẽ được giải quyết vấn đề của bạn bằng cách sử dụng giải pháp này.

Sau nghiên cứu ban đầu của tôi, tôi thấy rằng khi chúng tôi đóng trình duyệt, trình duyệt sẽ đóng từng tab một để đóng hoàn toàn trình duyệt. Do đó, tôi quan sát thấy rằng sẽ có rất ít thời gian trễ giữa việc đóng các tab. Vì vậy, tôi đã lấy thời gian trễ này làm điểm xác nhận chính của mình và có thể đạt được sự phát hiện sự kiện đóng trình duyệt và tab.

Tôi đã thử nghiệm nó trên Chrome Browser Phiên bản 76.0.3809.132 và thấy hoạt động

:) Bỏ phiếu nếu bạn thấy câu trả lời của tôi hữu ích ....


Vâng, điều này đã cho tôi một ý tưởng. Tôi đang đặt dấu thời gian cộng thêm 10 giây trong lưu trữ cục bộ sau khi đăng nhập và vào sự kiện trước khi tải. Khi tải tôi xác minh nếu thời gian trôi qua, sau đó chuyển hướng đến trang đăng nhập. Cảm ơn :)
G4BB3R

1
window.onbeforeunload = function() {
  console.log('event');
  return false; //here also can be string, that will be shown to the user
}

2
here also can be string, that will be shown to the usertuy nhiên, không phải trên firefox, nó hoạt động trong chrome ...
TrySpace

Mọi giá trị trả về (chuỗi) chỉ được hiển thị trong MSIE <= 11. Vì vậy, về cơ bản là vô dụng đối với tất cả các trình duyệt khác.
OSWorX 17/03/19

1

Có thể kiểm tra nó với sự trợ giúp của window. Được nêu trong trình xử lý sự kiện trong sự kiện 'unload' như thế này, nhưng việc sử dụng hết thời gian là bắt buộc (vì vậy kết quả không thể được đảm bảo nếu trì hoãn hoặc ngăn chặn cửa sổ đóng):

Ví dụ về JSFiddle (Đã thử nghiệm trên lates Safari, FF, Chrome, Edge và IE11)

var win = window.open('', '', 'width=200,height=50,left=200,top=50');
win.document.write(`<html>
   <head><title>CHILD WINDOW/TAB</title></head>
   <body><h2>CHILD WINDOW/TAB</h2></body>
</html>`);
win.addEventListener('load',() => {
    document.querySelector('.status').innerHTML += '<p>Child was loaded!</p>';
});
win.addEventListener('unload',() => {
    document.querySelector('.status').innerHTML += '<p>Child was unloaded!</p>';
    setTimeout(()=>{
        document.querySelector('.status').innerHTML +=  getChildWindowStatus();
    },1000);
});
win.document.close()
document.querySelector('.check-child-window').onclick = ()=> {
    alert(getChildWindowStatus());
}
function getChildWindowStatus() {
  if (win.closed) { 
      return 'Child window has been closed!';
  } else {
      return 'Child window has not been closed!';
  }
}

1

Tôi đã thử tất cả các giải pháp trên, không có giải pháp nào thực sự hiệu quả với tôi, đặc biệt bởi vì có một số thành phần Telerik trong dự án của tôi có nút 'Đóng' cho các cửa sổ bật lên và nó gọi là sự kiện 'trước khi tải'. Ngoài ra, bộ chọn nút không hoạt động chính xác khi bạn có lưới Telerik trong trang của bạn (ý tôi là các nút bên trong lưới) Vì vậy, tôi không thể sử dụng bất kỳ đề xuất nào ở trên. Cuối cùng, đây là giải pháp làm việc cho tôi. Tôi đã thêm một sự kiện onUnload trên thẻ body của _Layout.cshtml. Một cái gì đó như thế này:

<body onUnload="LogOff()">

và sau đó thêm chức năng LogPack để chuyển hướng đến Account / LogPack, đây là phương thức tích hợp sẵn trong Asp.Net MVC. Bây giờ, khi tôi đóng trình duyệt hoặc tab, nó sẽ chuyển hướng đến phương thức LogPack và người dùng phải đăng nhập khi trả về. Tôi đã thử nghiệm nó trong cả Chrome và Firefox. Và nó hoạt động!

  function LogOff() {
        $.ajax({
            url: "/Account/LogOff",
            success: function (result) {

                                        }
               });
       }

0
window.onbeforeunload = function ()
{       

    if (isProcess > 0) 
    {
        return true;       
    }   

    else
    { 
        //do something      
    }
}; 

Hàm này hiển thị hộp thoại xác nhận nếu bạn đóng cửa sổ hoặc làm mới trang trong bất kỳ quy trình nào trong trình duyệt. Chức năng này hoạt động trong tất cả các trình duyệt. Bạn phải đặt var isProcess trong quy trình ajax của mình.


mẫu đầy đủ cho bộ isProcess?
Kiquenet

0
window.addEventListener("beforeunload", function (e) {
 var confirmationMessage = "tab close";

 (e || window.event).returnValue = confirmationMessage;     //Gecko + IE
 sendkeylog(confirmationMessage);
 return confirmationMessage;                                //Webkit, Safari, Chrome etc.
}); 

Trên thực tế tôi muốn hiển thị Thông báo xác nhận nếu người dùng đóng Tab thì CHỈ. Đây là làm việc cho tôi. Nhưng tôi đang gặp phải một vấn đề rằng, nếu tôi nhấp vào bất kỳ liên kết nào của cùng một trang thì nó cũng hiển thị thông báo xác nhận. Cho moe tham khảo: w3schools.com/code/tryit.asp?filename=FEK2KWUN9R8Z @Tunaki
Mohammed

1
sendkeylog
Kiquenet

0

Như @jAndy đã đề cập, không có mã javascript chính xác để phát hiện một cửa sổ đang bị đóng. Tôi bắt đầu từ những gì @Syno đã đề xuất.

Tôi đã vượt qua mặc dù tình huống như vậy và miễn là bạn làm theo các bước này, bạn sẽ có thể phát hiện ra nó.
Tôi đã thử nghiệm nó trên Chrome 67+ và Firefox 61+.

var wrapper = function () { //ignore this

var closing_window = false;
$(window).on('focus', function () {
    closing_window = false; 
   //if the user interacts with the window, then the window is not being 
   //closed
});

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

    closing_window = true;
    if (!document.hidden) { //when the window is being minimized
        closing_window = false;
    }
    $(window).on('resize', function (e) { //when the window is being maximized
        closing_window = false;
    });
    $(window).off('resize'); //avoid multiple listening
});

$('html').on('mouseleave', function () {
    closing_window = true; 
    //if the user is leaving html, we have more reasons to believe that he's 
    //leaving or thinking about closing the window
});

$('html').on('mouseenter', function () {
    closing_window = false; 
    //if the user's mouse its on the page, it means you don't need to logout 
    //them, didn't it?
});

$(document).on('keydown', function (e) {

    if (e.keyCode == 91 || e.keyCode == 18) {
        closing_window = false; //shortcuts for ALT+TAB and Window key
    }

    if (e.keyCode == 116 || (e.ctrlKey && e.keyCode == 82)) {
        closing_window = false; //shortcuts for F5 and CTRL+F5 and CTRL+R
    }
});

// Prevent logout when clicking in a hiperlink
$(document).on("click", "a", function () {
    closing_window = false;
});

// Prevent logout when clicking in a button (if these buttons rediret to some page)
$(document).on("click", "button", function () {
    closing_window = false;

});
// Prevent logout when submiting
$(document).on("submit", "form", function () {
    closing_window = false;
});
// Prevent logout when submiting
$(document).on("click", "input[type=submit]", function () {
    closing_window = false;
});

var toDoWhenClosing = function() {

    //write a code here likes a user logout, example: 
    //$.ajax({
    //    url: '/MyController/MyLogOutAction',
    //    async: false,
    //    data: {

    //    },
    //    error: function () {
    //    },
    //    success: function (data) {
    //    },
    //});
};


window.onbeforeunload = function () {
    if (closing_window) {
        toDoWhenClosing();
    }
};

};


1
Bạn có một số vấn đề trong mã javascript của bạn. Điều đầu tiên tôi nhận thấy là bạn sẽ liên tục liên kết resizekhi cửa sổ bị mờ. Nếu nó bị mờ 100 lần thì bạn sẽ có 100 người nghe, điều này sẽ làm chậm trình duyệt.
Kyle

Tôi đặt $ (window) .off ('thay đổi kích thước'), điều này có đủ không?
Bruno Henrique

Về mặt kỹ thuật, nhưng nó cũng sẽ xóa bất kỳ trình xử lý nào khác được thêm vào nơi khác thông qua jQuery.
Kyle

-2

Hãy thử điều này, tôi chắc chắn rằng điều này sẽ làm việc cho bạn.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type='text/javascript'>
    $(function() {

        try{
            opera.setOverrideHistoryNavigationMode('compatible');
            history.navigationMode = 'compatible';
        }catch(e){}

        function ReturnMessage()
        {
            return "wait";
        }

        function UnBindWindow()
        {
            $(window).unbind('beforeunload', ReturnMessage);
        }

        $(window).bind('beforeunload',ReturnMessage );
    });
</script>

-3

Thử cái này. Nó sẽ làm việc. phương pháp dỡ tải jquery bị phản đối.

window.onbeforeunload = function(event) {
    event.returnValue = "Write something clever here..";
};
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.