Maison > interface Web > js tutoriel > le corps du texte

Comment implémenter la fonction d'actualisation de force arrière sur le côté Web de WeChat (tutoriel détaillé)

亚连
Libérer: 2018-06-01 15:14:15
original
1806 Les gens l'ont consulté

Cet article présente principalement le code d'implémentation de la fonction de rafraîchissement de la force arrière côté Web WeChat. Les amis dans le besoin peuvent s'y référer

Le code spécifique est le suivant :

<script>
  //生成uuid
  var uuidChars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz".split("");
  function uuid() {
    var r;
    var uuid = [];
    uuid[8] = uuid[13] = uuid[18] = uuid[23] = "-";
    uuid[14] = "4";
    for (i = 0; i < 36; i++) {
      if (!uuid[i]) {
        r = 0 | Math.random() * 16;
        uuid[i] = uuidChars[(i == 19) ? (r & 0x3) | 0x8 : r];
      }
    }
    return uuid.join("");
  }
  // 兼容 android
  history.replaceState(null, null, "/currentURL?a="+uuid());
  // 兼容 ios
  $(function () { 
     var isPageHide = false; 
     window.addEventListener(&#39;pageshow&#39;, function () { 
      if (isPageHide) { 
       window.location.reload(); 
      } 
     }); 
     window.addEventListener(&#39;pagehide&#39;, function () { 
      isPageHide = true; 
     }); 
  })
</script>
Copier après la connexion

•L'objet historique dans h5 utilisé du côté Android,

modifie l'URL actuelle (en épissant un uuid ou un nombre aléatoire) après le chargement de la page, de sorte qu'à chaque fois vous revenez en arrière, le navigateur trouve. Si l'URL actuelle n'existe pas dans le cache du navigateur, elle sera rechargée. history.replaceState(null, null, "/currentURL?a="+uuid());•Mais le côté iOS ne prend pas en charge la méthode ci-dessus, j'ai donc utilisé un morceau de code jquery pour le résoudre.

J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.

Articles connexes :

Exemple de code d'interception de demande vue axios

Utilisation de vue2 pour implémenter les fonctions de panier d'achat et de sélection d'adresse

Rendu côté serveur de la pratique de développement angulaire

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!