Dans un script, Remplacer le mode « hasard » par le mode « suivant »

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par Michel B., 3 Novembre 2018.

  1. Michel B.
    Michel B. Nouveau WRInaute
    Inscrit:
    19 Janvier 2008
    Messages:
    33
    J'aime reçus:
    1
    Bonjour à toutes et à tous,
    Vous connaissez sans doute ce petit script :
    Code:
    <body onload="actualiser();">
    <div id="Variante"></div>
    <button onclick="actualiser()">Actualiser</button>
    <script type="text/javascript">
    function actualiser(){
    var proverbes = new Array(
    "Il faut manger pour vivre et non vivre pour manger.",
    "À chaque jour suffit sa peine.",
    "Les plaisanteries les plus courtes sont les meilleures.",
    "Tel est pris qui croyait prendre."
    );
    document.getElementById("Variante").innerHTML=proverbes[Math.floor(Math.random() * proverbes.length)];}
    </script>
    </body>
    Ce petit script affiche sur une page web une variante prise au hasard dans une liste et remplacée par une autre à chaque rafraîchissement de la page ou lors d’un clic sur un bouton de rafraîchissement.
    Ce script a ses qualités mais présente un double défaut :
    - une même variante peut s’afficher deux fois consécutives
    - une variante peut ne s’afficher jamais avant le départ du visiteur.
    Dans certains cas, on préfère donc que ces variantes soient appelées non pas de façon aléatoire mais l’une après l’autre. Le bouton aurait alors la fonction correspondant à « Suivant ».
    Hélas, j’ai parcouru en vain la toile à la recherche de la formule et je n’ai pas le bagage suffisant pour la développer moi-même.
    Quelqu’un connaît-il la solution ?
     
  2. rick38
    rick38 WRInaute passionné
    Inscrit:
    23 Février 2013
    Messages:
    1 340
    J'aime reçus:
    171
    Puisqu'un rafraîchissement de page fait tout perdre, il faut passer par un cookie pour se souvenir du dernier indice.

    donc lire le cookie en récupérant la valeur dans une variable i (à voir comment faire en js), puis :

    document.getElementById("Variante").innerHTML=proverbes[++i];

    Puis créer/écraser le cookie avec la valeur de i
    quelque chose comme :

    document.cookie = "nom_du_cookie=" + i + "; path=/";

    Faut aussi gérer quand on est à la fin pour que i retourne à 0.

    Une autre façon c'est de stocker la liste des valeurs déjà utilisées si on veut garder le mode aléatoire sans afficher deux fois la même chose.
     
    #2 rick38, 3 Novembre 2018
    Dernière édition: 3 Novembre 2018
  3. Michel B.
    Michel B. Nouveau WRInaute
    Inscrit:
    19 Janvier 2008
    Messages:
    33
    J'aime reçus:
    1
    Je vous remercie, Rick, pour votre réponse.
    J’ai également une alternative, recourant à "toggle" pour afficher/masquer les variantes de sorte qu’une seule soit affichée sur la page.
    Voici le code :
    Code:
    <body>
    <div id="V1" class="texte" style="display:block">Il faut manger pour vivre et non vivre pour manger.</div>
    <div id="V2" class="texte" style="display:none">À chaque jour suffit sa peine.</div>
    <div id="V3" class="texte" style="display:none">Les plaisanteries les plus courtes sont les meilleures.</div>
    <div id="V4" class="texte" style="display:none">Tel est pris qui croyait prendre.</div>
    <a href="javascript:toggle('V1');">Variante 1</a>
    <a href="javascript:toggle('V2');">Variante 2</a>
    <a href="javascript:toggle('V3');">Variante 3</a>
    <a href="javascript:toggle('V4');">Variante 4</a>
    <script type="text/javascript">
    function toggle(ele) {
       $(".texte").hide();
       $("#"+ele).show();
    }
    </script>
    <script type="text/javascript" src="../jquery.js"></script>
    </body>
    Dans ce cas, je me retrouve avec quatre boutons commandant l'affichage de chaque variante. Or, je voudrais n’en conserver alors qu’un seul, avec la valeur « Suivant » et une commande qui le permette.
    Mais je rame !
     
  4. Michel B.
    Michel B. Nouveau WRInaute
    Inscrit:
    19 Janvier 2008
    Messages:
    33
    J'aime reçus:
    1
    Bonjour,
    J’ai finalement construit ma Baragouineuse par l’amalgame des deux méthodes : l’affichage aléatoire d’un texte parmi ceux d’une liste non affichée et l’appel nécessaire de ce texte sorti de cette même liste au moyen d’un lien direct.
    De la sorte, le visiteur pressé peut soit cliquer sur le bouton « Baragouiner » pour faire rapidement défiler les variantes sans autre déplacement de la main, soit sélectionner le numéro du cas dont il veut voir immédiatement un exemple.
    Quant au code, il est réalisé de manière expérimentale. Si quelqu’un voit comment le simplifier ou le nettoyer, je lui en serais reconnaissant.
     
  5. julien57250
    julien57250 Nouveau WRInaute
    Inscrit:
    17 Janvier 2012
    Messages:
    15
    J'aime reçus:
    0
    Vous devez sans doute avoir vos raisons mais je ne vois pas vraiment l'intérêt d'utiliser jQuery pour faire ça.
     
  6. Michel B.
    Michel B. Nouveau WRInaute
    Inscrit:
    19 Janvier 2008
    Messages:
    33
    J'aime reçus:
    1
    Si vous examinez le code de la page, vous vous apercevrez que les variantes masquées apparaissent « à la demande », c’est-à-dire par appel aléatoire ou par un clic sur les liens numérotés, avec la commande « toggle », laquelle, je pense, est plus courte que le javascript classique.
    En tout cas, c’est le script qui m’est tombé sous les yeux et que j’ai pu adapter à mes souhaits. En outre, le fichier jquery est chargé sur mon serveur et appelé par la plupart de mes pages, notamment pour distinguer liens internes (qui s’ouvrent dans la fenêtre du navigateur) et liens externes (qui ouvrent un nouvel onglet).
    Bon vent à vous.
     
  7. rollback
    rollback WRInaute occasionnel
    Inscrit:
    5 Novembre 2018
    Messages:
    458
    J'aime reçus:
    49
    oui mais michel, on était habitué aux chemins de traverses.
    Quel est la différence sinon entre ces deux phrases:
    Utiliser Jquery qui utilise de toutes façons le Javascript, pourquoi s'embêter
    Aller chez Ronald qui utilise de toutes façons du boeuf, pourquoi cuisiner

    Pourquoi ?????
     
  8. Michel B.
    Michel B. Nouveau WRInaute
    Inscrit:
    19 Janvier 2008
    Messages:
    33
    J'aime reçus:
    1
    Attendez, Rollback ! C’est moi qui demandais à la communauté WebRankInfo le moyen d’afficher dans un même cadre un texte l’un après l’autre en actionnant un seul bouton, qui remplirait alors la fonction « Suivant », comme dans un diaporama pour les images.
    Ignorant la solution, je ne rejetais donc pas à priori tel ou tel moyen qui m’eût été proposé.
    Ne me forcez pas à me ranger dans le camp des partisans ou des pourfendeurs de Jquery : je ne suis pas habilité à traiter de la question.
    Mais ne me dites pas que je cuisine au rab(el)ais !
     
  9. rollback
    rollback WRInaute occasionnel
    Inscrit:
    5 Novembre 2018
    Messages:
    458
    J'aime reçus:
    49
    merci 10 fois pour ce bon mot du petit déjeuner
    c'est devenu rare de converser sur un forum, disons une chance sur 1000
    Ça fait quand même 12.5 % de chance
     
  10. Michel B.
    Michel B. Nouveau WRInaute
    Inscrit:
    19 Janvier 2008
    Messages:
    33
    J'aime reçus:
    1
    On s’en raconte et l’on se compte, on s’en rend compte…
    À moi, comte, deux mots !
    Et s’il n’en reste qu’un, là, ce sera le bon :
    Celui de la faim/fin.
     
Chargement...
Similar Threads - script Remplacer mode Forum Date
Remplacer du javascript par du html Problèmes de référencement spécifiques à vos sites 14 Novembre 2012
Script slideshow pour remplacer celui de wordpress Développement d'un site Web ou d'une appli mobile 18 Janvier 2010
Emails type code de confirmation d'inscription : HTML ou TXT Administration d'un site Web Vendredi à 13:12
WordPress Description et avis sur la même page : Structure Hn différentes ?? Débuter en référencement 6 Février 2020
Description non reprise par Google Problèmes de référencement spécifiques à vos sites 7 Janvier 2020
style.css unique préférable avec link ou javascript ? Développement d'un site Web ou d'une appli mobile 25 Décembre 2019
Comment forcer Google à prendre en compte Title et Meta Description Référencement Google 23 Décembre 2019
Title et meta déscription par PHP Référencement Google 20 Décembre 2019
Maillage interne : liens dans le descriptif de catégorie Débuter en référencement 13 Décembre 2019
Scripts de réseau social Le café de WebRankInfo 13 Décembre 2019
  1. Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies.
    Rejeter la notice