Partage
  • Partager sur Facebook
  • Partager sur Twitter

Supprimer une class pour empêcher scroll infinie

    13 mai 2022 à 17:23:58

    Bonjour, j'ai un code tel que : 

    <html>
      <div class='abc item'>
      <di>
    </html>
    <script>
      let ias = new InfiniteAjaxScroll('.container', {
         item: '.item',
         next: '.next',
         pagination: '.pagination'
      });
      var url = window.location.href;
      const article = document.querySelector(".abc");
      if(url.indexOf('article') != -1)
      {
         article.className.remove = 'item';
      }
    </script>

    Et mon objectif est de supprimer la balise item, comme vous pouvez le voir. Pour que le scroll ne puisse pas s'effectuer sur la div de class 'abc'.

    Mais avec cette methode la classe item est bien supprimé, sauf que cela ne change rien (on peut toutoujours faire scoller la balise).

    Alors que qu'en supprimant manuellement la class item cela fonctionne et il devient impossible de scroller.

    J'aurais pu le faire en PHP mais je le trouve moins adapté que le js dans ce contexte.

    J'aimerais savoir pourquoi se comportement. Car j'ai besoin de pouvoir suprrimer/réecrire la class en fonction de mes besoins.

    Y'aurais t-il une meilleur méthode ?

    • Partager sur Facebook
    • Partager sur Twitter
      13 mai 2022 à 18:31:37

      Bonjour,

      je ne suis pas sûr que ce soit ça mais juste après la ligne 15, as-tu essayer d'écrire la ligne suivante ?

      location.reload()

      Peut-être qu'il faut juste recharger la page pour empêcher le scroll une fois 'item' supprimé ?

      • Partager sur Facebook
      • Partager sur Twitter
        13 mai 2022 à 18:59:51

        Bonjour.

        article.className.remove = 'item';

        Je doute que cette ligne ci-dessus fonctionne comme prévu.

        article.classList.remove('item');

        l'expression:

        article.classList

        fait référence à une instance d'un DOMTokenList

        et l'expression:

        article.className

        fait référence à une simple chaîne de texte contenant la liste des classes de l'élément.

        DOMTokenList est plus simple pour manipuler les classes, il contient des méthodes pré à l'emploi pour supprimer/ajouter/modifier vérifier l'existence de classes sur un élément.




        -
        Edité par SamuelGaborieau3 13 mai 2022 à 19:01:56

        • Partager sur Facebook
        • Partager sur Twitter

        suggestion de présentation.

          13 mai 2022 à 19:35:32

          Merci, pour vos réponses.

          NathanaëlMarie-Louise a écrit:

          Peut-être qu'il faut juste recharger la page pour empêcher le scroll une fois 'item' supprimé ?


          J'ai déja essayer en rechargant manuellement avec F5 mais cela ne fonctionne pas contrairement avec la supression de la class directement dans le code source.

          @SamuelGaborieau3 Oui, je l'avais corriger dans mon code, j'ai oublié de faire de même ici.

          -
          Edité par Bernard lagoutte 13 mai 2022 à 19:37:32

          • Partager sur Facebook
          • Partager sur Twitter
            15 mai 2022 à 17:02:55

            Re bonjour, et même après avoir corriger cela ne fonctionne toujours pas ?

            Est-ce que tu as une erreur dans la console Javascript ?

            Lorsque tu supprimes manuellement la classes dans la console, est-ce que tu es sûr que c'est sur le même élément, qui est ciblé par Javascript ?

            Est-ce que tu as plusieurs éléments avec la classe item où la classe abc dans ton document ? Car tu sélectionnes uniquement le premier dans le document.

            Est-ce qu'il y à bien le mot "article" présent dans l'URL ? Car sinon ton javascript qui supprime la classe ne s'exécuterait pas. 

            -
            Edité par SamuelGaborieau3 15 mai 2022 à 17:03:24

            • Partager sur Facebook
            • Partager sur Twitter

            suggestion de présentation.

            Supprimer une class pour empêcher scroll infinie

            × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
            • Editeur
            • Markdown