Jak wykryć odświeżanie strony za pomocą jquery?

Question

Jak mogę uchwycić zdarzenie ponownego załadowania strony?

Mam system przesyłania wiadomości, który traci wszystkie dane wejściowe, gdy użytkownik odświeża stronę. Chcę użyć ajax do ponownego wypełnienia, stąd moja potrzeba wykrycia, kiedy strona została odświeżona/przeładowana.

Answer 1

$('body').bind('beforeunload',function(){ 
    //do something 
}); 

Ale to przyzwyczajenie zapisać wszelkie informacje na później, jeśli nie planują na oszczędności, które w pliku cookie gdzieś (lub lokalnej pamięci masowej) oraz imprezy unload nie zawsze ogień we wszystkich przeglądarkach.

---

Przykład: http://jsfiddle.net/maniator/qpK7Y/

Kod:

$(window).bind('beforeunload',function(){ 

    //save info somewhere 

    return 'are you sure you want to leave?'; 

}); 

Answer 2

cały kod po stronie klienta, mam nadzieję, że dobrze to pomocne:

Pierwszą rzeczą są 3 funkcje będziemy używać :

function setCookie(c_name, value, exdays) { 
      var exdate = new Date(); 
      exdate.setDate(exdate.getDate() + exdays); 
      var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString()); 
      document.cookie = c_name + "=" + c_value; 
     } 

    function getCookie(c_name) { 
     var i, x, y, ARRcookies = document.cookie.split(";"); 
     for (i = 0; i < ARRcookies.length; i++) { 
      x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("=")); 
      y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1); 
      x = x.replace(/^\s+|\s+$/g, ""); 
      if (x == c_name) { 
       return unescape(y); 
      } 
     } 
    } 

    function DeleteCookie(name) { 
      document.cookie = name + '=; expires=Thu, 01-Jan-70 00:00:01 GMT;'; 
     } 

Teraz zaczniemy ładowania strony:

$(window).load(function() { 
//if IsRefresh cookie exists 
var IsRefresh = getCookie("IsRefresh"); 
if (IsRefresh != null && IsRefresh != "") { 
    //cookie exists then you refreshed this page(F5, reload button or right click and reload) 
    //SOME CODE 
    DeleteCookie("IsRefresh"); 
} 
else { 
    //cookie doesnt exists then you landed on this page 
    //SOME CODE 
    setCookie("IsRefresh", "true", 1); 
} 
}) 

Answer 3

jeśli chcesz bookkeep pewną zmienną przed odświeżania strony

$(window).on('beforeunload', function(){ 
    // your logic here 
}); 

jeśli chcesz o załadować jakąś zawartość bazy na jakimś stanie

$(window).on('load', function(){ 
    // your logic here`enter code here` 
}); 

Answer 4

Istnieją dwa zdarzenia po stronie klienta podane poniżej.

1. window.onbeforeunload (wzywa Przeglądarka/karcie Close & Page Load)

2. window.onload (połączenia na stronie obciążenia)

Na Server Side

public JsonResult TestAjax(string IsRefresh) 
    { 
     JsonResult result = new JsonResult(); 
     return result = Json("Called", JsonRequestBehavior.AllowGet); 
    } 

po stronie klienta

<script type="text/javascript"> 
 
    window.onbeforeunload = function (e) { 
 
     
 
     $.ajax({ 
 
      type: 'GET', 
 
      async: false, 
 
      url: '/Home/TestAjax', 
 
      data: { IsRefresh: 'Close' } 
 
     }); 
 
    }; 
 

 
    window.onload = function (e) { 
 

 
     $.ajax({ 
 
      type: 'GET', 
 
      async: false, 
 
      url: '/Home/TestAjax', 
 
      data: {IsRefresh:'Load'} 
 
     }); 
 
    }; 
 
</script>

w przeglądarce/Tab Zamknij: jeśli użytkownik zamknięciu przeglądarki/kartę, a następnie window.onbeforeunload zostanie uaktywniona, a wartość IsRefresh po stronie serwera będzie "Blisko".

Refresh/Reload/F5: Jeśli użytkownik będzie odświeżyć stronę, najpierw window.onbeforeunload zadziała z IsRefresh value = "Zamknij", a następnie window.onload zadziała z IsRefresh value = "Load", a więc teraz możesz wreszcie stwierdzić, że twoja strona się odświeża.