Come posso rilevare un aggiornamento della pagina usando jquery?

Question

Come posso acquisire l'evento di ricarica della pagina?

Ho un sistema di messaggistica che perde tutto il suo input quando l'utente aggiorna la pagina. Voglio usare ajax per ri-popolare, quindi il mio bisogno di rilevare quando la pagina è stata aggiornata/ricaricata.

Answer 1

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

Ma questo voleva risparmiare qualche info per dopo, a meno che non si stavano progettando sul risparmio che in un cookie da qualche parte (o storage locale) e l'evento unload non sempre il fuoco in tutti i browser.

---

Esempio: http://jsfiddle.net/maniator/qpK7Y/

Codice:

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

    //save info somewhere 

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

}); 

Answer 2

Tutto il codice è lato client, vi auguro bene questa utile:

La prima cosa che ci sono 3 funzioni che userà :

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;'; 
     } 

Ora si inizierà con il caricamento della pagina:

$(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

se si vuole bookkeep qualche variabile prima pagina di aggiornamento

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

se si desidera o caricare alcuni base di contenuti a una certa condizione

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

Answer 4

Ci sono due eventi sul lato client come indicato di seguito.

1. window.onbeforeunload (chiamate su Browser/scheda Chiudi & caricamento della pagina)

2. window.onload (chiamate a pagina Load)

Sul lato server

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

Sul lato client

<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>

On Browser/Tab Chiudi: se l'utente chiude il browser/scheda, quindi window.onbeforeunload scatta e il valore IsRefresh sul lato server sarà "Vicino".

su Aggiorna/Ricarica/F5: Se l'utente si aggiorna la pagina, prima window.onbeforeunload scatterà con valore IsRefresh = "Chiudi" e quindi window.onload sparerà con IsRefresh value = "Carica", così ora puoi finalmente determinare che la pagina è in fase di aggiornamento.