Pour chrome, l'événement se déclenche au chargement de la page, mais dans Firefox, il se déclenche à droite, uniquement lorsque vous appuyez sur le bouton Précédent ou Suivant. Alors, comment écrire un script qui fonctionne bien pour tous les navigateurs?Quelle est la façon idéale de gérer window.onpopstate pour tous les navigateurs?
Je voudrais aller la détection du navigateur sur celui-ci (en fait, je l'ai fait). J'utilise le .data de jquery() pour définir un indicateur booléen pour effectuer le test:
// chrome fires a popstack event on page load, so do a check before proceeding
var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
if(is_chrome && !$('body').data('allow-popstate-action')) {
$('body').data('allow-popstate-action', true);
return false;
}
J'ai ajouté cette clause conditionnelle dans la fonction qui est lié à l'événement popstate, donc la première fois qu'il est appelé à Chrome (qui est en chargement de la page), il quitte simplement la fonction sans rien faire. La prochaine fois (boutons prev/back), cela fonctionnera bien.
Je suis coincé avec une ancienne version de jQuery sur ce projet, donc je ne pouvais pas utiliser jQuery.browser.webkit, mais vous pouvez probablement.
Une manière légèrement plus élégante consiste à ajouter un délai de 1ms avant d'ajouter l'écouteur popstate. Puisque le popstate initial se déclenchera avant que tout code asynchrone ne soit exécuté, votre fonction popstate fonctionnera correctement (uniquement pour les actions avant/arrière):
window.setTimeout(function(){
$(window).on('popstate', function(event){
// do things
});
}, 1);