jQuery Girl
  1. jQuery Girl
  3. Javascript / JQuery ne fonctionne pas après le rechargement de la page
Intereting Posts
Zone de saisie semi-automatique à l’aide de Durandal JS Pré-charger des fichiers audio côté client pour une utilisation ultérieure JQuery 3 et SignalR 2.2.0 Comment puis-je append une classe «sélectionnée» basée sur une URL avec jQuery? Recherche multiple avec plusieurs champs par défaut Opération illégale sur l’object prototype WrappedNative Pourquoi dois-je actualiser chaque page pour que jQuery fonctionne correctement sur chacune d’elles? Comment réparer l’élément d’entrée iOS 11 dans le bug des modaux fixes Node.js: interrogation longue avec EventEmitter et Express 4.x | Demande de capture close Comment supprimer tous les gestionnaires d’événements pour les éléments enfants d’un élément parent à l’aide de JQuery Élément JQuery + performance du sélecteur de classe Image de fond jquery mobile La capture du contenu mis à jour à partir du texte se fait en variable JSON Comment appliquer un sélecteur “: contient” sans jQuery? L’API Mailchimp reçoit une erreur et ne peut pas utiliser le succès ajax

Javascript / JQuery ne fonctionne pas après le rechargement de la page

Ce code est répertorié dans l’en-tête de toutes mes pages Web. Lorsque je clique sur un lien de mon site Web, je ne peux utiliser les boutons de la page qu’après l’actualisation. Comment puis-je réparer cela? 

  $(document).ready(function() { $('.faqElement').click(function() { var faqElement = $(this); var question = faqElement.find('.faqQuestion'); var answer = faqElement.find('.faqAnswer'); if (!answer.hasClass('activeFaqAnswer')) { $('.faqElement').removeClass('flipButton'); faqElement.addClass('flipButton'); $('.activeFaqAnswer').css('max-height', ''); $('.faqAnswer').removeClass('activeFaqAnswer'); answer.css('max-height', 'none'); answer.css('max-height', answer.height()); answer.addClass('activeFaqAnswer'); } }); });

Cela ressemble à un conflit avec votre script personnalisé et le chargement AJAX de Squarespace :

Ajax peut parfois entrer en conflit avec du code personnalisé intégré ou des liens d’ancrage. Ajax peut également interférer avec les parsings de site, en enregistrant les hits sur la première page uniquement.

Ainsi, selon votre modèle, vous constaterez peut-être que la désactivation d’AJAX est une solution simple:

Vous pouvez désactiver Ajax dans l’éditeur de style, à quelques exceptions près:

  • Ajax ne peut pas être désactivé dans Skye, Foundry ou Tudor.
  • Ajax ne peut pas être désactivé sur la page de destination du blog pour Farro et Haute. Si vous décochez Activer le chargement Ajax dans ces modèles, ils utiliseront quand même Ajax pour charger la page de blog.

Pour activer ou désactiver Ajax:

  • Dans le menu Accueil, cliquez sur Conception, puis sur l’éditeur de styles.
  • Faites défiler jusqu’à Site: Chargement.
  • Cochez ou décochez Enable Ajax Loading.

Si vous ne souhaitez pas désactiver complètement AJAX, il est souvent préférable d’insérer les éléments suivants via l’injection de code d’en-tête (sur les modèles plus récents, tels que la famille Brine / Wright):

Si cela ne fonctionne pas, vous devez configurer un observateur de mutation sur l’élément body pour surveiller les modifications d’atsortingbuts, notamment l’ id . Au moment de la rédaction du présent document, une telle approche était nécessaire pour la famille de modèles York / Doncab.

Notez que pour certaines pages, telles que /cart/ page, cette méthode peut ne pas s’exécuter comme prévu, ce qui crée un besoin supplémentaire pour setInterval , requestAnimationFrame ou une méthode d’observation de mutation mentionnée précédemment.