web-dev-qa-db-fra.com

Après être revenu dans l'historique de Firefox, JavaScript ne fonctionnera pas

Lorsque j'utilise le bouton Précédent de Firefox pour accéder à une page précédemment visitée, les scripts de cette page ne seront plus exécutés.

Existe-t-il tout correctif/solution de contournement pour que les scripts s'exécutent à nouveau lors de la deuxième page?

Veuillez noter que j'ai testé les mêmes pages sur Google Chrome et Internet Explorer et qu'elles fonctionnent comme prévu.

Voici les fichiers et les étapes que j'ai utilisées pour tester le problème:

(naviguez jusqu'à 0.html, cliquez pour accéder à 1.html, bouton de retour)

0.html

<html><body>
<script>
  window.onload = function() { alert('window.onload alert'); };
  alert('inline alert');
</script>
<a href="1.html">Click Me!</a>
</body></html>

1.html

<html><body>
<p>Go BACK!</p>
</body></html>
javascriptfirefox
73
Patonza

Définit une fonction vide à appeler sur window.onunload:

window.onunload = function(){};

par exemple.

<html><body>
<script type="text/javascript">
  window.onload = function() { alert('window.onload alert'); };
  window.onunload = function(){};
  alert('inline alert');
</script>
<a href="1.html">Click Me!</a>
</body></html>

Source:http://www.firefoxanswer.com/firefox/672-firefoxanswer.html(Version archivée)

84
fig

Lorsque j'utilise le bouton Précédent de Firefox pour accéder à une page précédemment visitée, les scripts de cette page ne sont plus exécutés.

C'est correct et c'est une bonne chose.

Lorsque vous cliquez sur un lien dans Firefox (et Safari et Opera), votre page ne sera pas immédiatement détruite pour passer au suivant. Il garde la page intacte, la cachant simplement de la vue. Si vous appuyez sur le bouton Précédent, l'ancienne page sera à nouveau visible sans avoir à charger à nouveau le document. cela est beaucoup plus rapide, ce qui permet à l'utilisateur de faire des transitions de page en arrière plus en douceur.

Cette fonctionnalité est appelée bfcache .

Tout contenu que vous avez ajouté à la page lors du chargement et de l'utilisation précédents de l'utilisateur sera toujours là. Tous les gestionnaires d'événements que vous avez attachés aux éléments de page seront toujours attachés. Tous les délais/intervalles que vous avez définis seront toujours actifs. Il est donc rarement nécessaire que vous sachiez que vous avez été caché et rediffusé. Il serait erroné d'appeler à nouveau onload ou le code de script en ligne, car toute génération de liaison et de contenu effectuée dans cette fonction serait exécutée une seconde fois sur le même contenu, avec des résultats potentiellement désastreux. (Par exemple, document.write dans le script en ligne détruirait totalement la page.)

La raison pour laquelle écrire dans window.onunload a un effet, c'est que les navigateurs qui implémentent bfcache ont décidé que - pour des raisons de compatibilité avec les pages qui ont vraiment besoin de savoir quand elles sont supprimées - toute page qui déclare vouloir savoir quand onunload se produit entraînera la désactivation de bfcache. Cette page sera chargée à nouveau lorsque vous y retournerez, au lieu d'être extraite de bfcache.

Donc, si vous définissez window.onunload= function() {};, ce que vous faites réellement, c’est délibérément de casser le bfcache. Cela ralentira la navigation de vos pages et ne devrait être utilisé qu'en dernier recours.

Si vous avez besoin de savoir quand l'utilisateur quitte ou revient sur votre page, sans déranger bfcache, vous pouvez intercepter les événements onpageshow et onpagehide à la place:

window.onload=window.onpageshow= function() {
    alert('Hello!');
};
66
bobince

Vous pouvez vérifier la propriété persisted de l'événement pageshow. Il est défini sur false lors du chargement initial de la page. Lorsque la page est chargée à partir du cache, elle est définie sur true.

window.onpageshow = function(event) {
    if (event.persisted) {
        alert("From bfcache");
    }
};

Pour une raison quelconque, jQuery n'a pas cette propriété dans l'événement. Vous pouvez le trouver de l'événement original cependant.

$(window).bind("pageshow", function(event) {
    if (event.originalEvent.persisted) {
        alert("From bfcache");
    }
});
19
Mika Tuupola

Fil dans un événement "onunload" qui ne fait rien:

<html><body>
<script type="text/javascript">
  window.onload = function() { alert('window.onload alert'); };
  window.onunload = function(){}; 
  alert('inline alert');
</script>
<a href="1.html">Click Me!</a>
</body></html>
1
Chris Haas

Autant que je sache, Firefox ne déclenche pas l'événement onLoad à l'envers. 

Il devrait plutôt déclencher onFocus à partir de ce lien ici .

1
systempuntoout

L'événement OnPopState est un moyen simple de forcer une page à exécuter JavaScript lorsque l'utilisateur y retourne à l'aide de l'historique du navigateur. Nous l'utilisons pour mettre en pause et rejouer la vidéo sur notre page d'accueil ( https://fynydd.com ).

window.onpopstate = function() {

    // Do stuff here...
};
1
Michael A.

dans certains cas, comme les opérations ajax, le listener de changement d'URL peut être utilisé 

$(window).on('hashchange', function() {
        ....
});
0
Tamer