rafraîchie ma fonction toutes les 10 secondes

17 juin 2019 à 21:46:15

Bonjour.

je ne suis vraiment pas traie fort avec js et j'aimerais que cette fonction

<div class="infosRpDiv">
		<script type="text/javascript"> 
			 function aleatoire(phrases) { 
			  var length = phrases.length; 
			  var rand   = Math.floor(Math.random()*length); 
			  document.write(phrases[rand]);
			 } 
			 aleatoire([ 
			 "<p class='infosRp'>Le saviez vous ? si vous changer d'etat la police ne peut plus vous rechercher !</p>", 
			 "Citation 2", 
			 "Citation 3", 
			 "Citation 4", 
			 "Citation 5", 
			 "Citation 6" 
			  ]); 
		</script>

soit réactualise toute les 10 secondes pour avoir un nouveau texte aléatoire s'en rafraîchir toute la page .

sachant que ce fichier index.html et pas un site mais un fichier utilisé pour s’afficher sur un jeu donc ils a pas d'url.

a ce que j'aurais compris sur internet ils faudrait utilisé AJAX mais je comprend encore moins comment mis prendre .

AbcAbc6

17 juin 2019 à 22:08:55

Bonjour,

Manque de recherche

La question que vous posez est très fréquente, cela démontre un manque de recherche évident. Internet et ce forum fourmillent de ressources répondant à votre besoin.

Je vous invite à effectuer de vraies recherches qui sont à la base d'un bon apprentissage…

Voir setInterval()

NicolasDreux

17 juin 2019 à 22:42:48

Merci pour votre réponse je ne suis pas tombé dessus pourtant j'ai chercher enfin bref.

j'ai essayer un truc du style .

<html>
    
    <head>    
        <meta charset="utf-8"/>
        <link type ="text/css" rel ="stylesheet" href ="css/icomoon.css"/>        
        <link type ="text/css" rel ="stylesheet" href ="css/index.css"/>
        <link type ="text/css" rel ="stylesheet" href ="css/colors.css"/>
		
		<script type="text/javascript">
			var intervalID;
			function changeText() {
				intervalID = setInterval(flashText, 1000);
			}

			function flashText() {
				var elem = document.getElementById("infosRpDiv");
				function aleatoire();
				 
			}
		</script>
    </head>

    <body onload="changeText();">
        <img id="background"/>
        <img id="background2"/>

        <img id="cursor"/>

        <div id="music-info">
            <p id="now-playing">Now playing: n.a.</p>
            <div id="play-button" class="icon-button icon-pause2" onclick="OnPlayClick()"></div>
            <div id="skip-button" class="icon-button icon-next2" onclick="OnSkipClick()"></div>
            <input type="range" min="1" max="100" id="volumeSlider">
        </div>
        
        <img id="logo"/>

        <div class="content-container">
            <span>
                <p id="message" class="loading-text">Connexion au serveur en cours... &#x1f40c; &#x1f528;</p>
                <p class="loading-text stick-to-right"><span id="progress-bar-value">0</span>%</p>
            </span>
        </div>
          
        <div class="content-container">
            <progress id="pb0" class="hide" min="0" max="100" value="0"></progress>
            <progress id="pb1" class="hide" min="0" max="100" value="0"></progress>
            <progress id="pb2" class="hide" min="0" max="100" value="0"></progress>
            <progress id="pb3" class="hide" min="0" max="100" value="0"></progress>
            <progress id="pb4" class="hide" min="0" max="100" value="0"></progress>          
        </div> 

        <ul id="log"></ul>    

        <div id="player"></div>
		<div class="infosRpDiv">
		<script type="text/javascript"> 
			 function aleatoire(phrases) { 
			  var length = phrases.length; 
			  var rand   = Math.floor(Math.random()*length); 
			  document.write(phrases[rand]);
			 } 
			 aleatoire([ 
			 "<p class='infosRp'>Le saviez vous ? si vous changer d'etat la police ne peut plus vous rechercher !</p>", 
			 "Citation 2", 
			 "Citation 3", 
			 "Citation 4", 
			 "Citation 5", 
			 "Citation 6" 
			  ]); 

		</script> 
		</div>
    

    <script src="js/synn.js"></script>    
    <script src="js/config.js"></script>
    <script src="js/logger.js"></script>    
    <script src="js/progressbar-main.js"></script>
    <script src="js/progressbar-handler.js"></script>
    <script src="js/progressbar-renderer.js"></script>
    <script src="js/music-handler.js"></script>
    <script src="js/music-controls.js"></script>
    <script src="js/background-handler.js"></script>
	</body>
</html>

sauf que sa change pas.

AbcAbc6

17 juin 2019 à 23:45:45

Bonsoir,

Comme tu as écrit la fonction aleatoire tu lui passe un paramètre obligatoire, pour ce faire je passe par une fonction anonyme sans paramètre ce qui respecte le fonctionnement de setInterval. Et je passe le paramètre phrases à la fonction aleatoire dans le corps de la fonction anonyme.

Pour ce qui est de l’HTML pas de paragraphe à l’intérieur d’un span. Ce n’est pas valide : => supprime les lignes 39 et 42.

Il n’y a pas d’attribut min pour progress

https://developer.mozilla.org/fr/docs/Web/HTML/Element/Progress

J’imagine que tu ajoutes, en JS, l’attribut alt obligatoire pour la balise <img> !

<html>
     
    <head>   
        <meta charset="utf-8"/>
        <link type ="text/css" rel ="stylesheet" href ="css/icomoon.css"/>       
        <link type ="text/css" rel ="stylesheet" href ="css/index.css"/>
        <link type ="text/css" rel ="stylesheet" href ="css/colors.css"/>
         
        <script type="text/javascript">
            var intervalID;
            let phrases = [
             "<p class='infosRp'>Le saviez vous ? si vous changer d'etat la police ne peut plus vous rechercher !</p>",
             "Citation 2",
             "Citation 3",
             "Citation 4",
             "Citation 5",
             "Citation 6"
              ];
              
            function changeText() {
                window.setInterval(function() {aleatoire(phrases) }  , 1000);
            }
 
            function aleatoire(phrases ) {
              var length = phrases.length;
              var rand   = Math.floor(Math.random()*length);
              //document.write(phrases[rand]);
              const divPhrase = document.getElementById('phrase');
              divPhrase.innerHTML = phrases[rand];
             }
        </script>
    </head>
 
    <body onload="changeText()">
        <img id="background"/>
        <img id="background2"/>
 
        <img id="cursor"/>
 
        <div id="music-info">
            <p id="now-playing">Now playing: n.a.</p>
            <div id="play-button" class="icon-button icon-pause2" onclick="OnPlayClick()"></div>
            <div id="skip-button" class="icon-button icon-next2" onclick="OnSkipClick()"></div>
            <input type="range" min="1" max="100" id="volumeSlider">
        </div>
         
        <img id="logo"/>
 
        <div class="content-container">
            
                <p id="message" class="loading-text">Connexion au serveur en cours... &#x1f40c; &#x1f528;</p>
                <p class="loading-text stick-to-right"><span id="progress-bar-value">0</span>%</p>
            
        </div>
           
        <div class="content-container">
            <progress id="pb0" class="hide"  max="100" value="0"></progress>
            <progress id="pb1" class="hide"  max="100" value="0"></progress>
            <progress id="pb2" class="hide"  max="100" value="0"></progress>
            <progress id="pb3" class="hide"  max="100" value="0"></progress>
            <progress id="pb4" class="hide"  max="100" value="0"></progress>         
        </div>
 
        <ul id="log"></ul>   
 
        <div id="player"></div>
        <div class="infosRpDiv" id="phrase"> </div>
      
       
     
 
    <script src="js/synn.js"></script>   
    <script src="js/config.js"></script>
    <script src="js/logger.js"></script>   
    <script src="js/progressbar-main.js"></script>
    <script src="js/progressbar-handler.js"></script>
    <script src="js/progressbar-renderer.js"></script>
    <script src="js/music-handler.js"></script>
    <script src="js/music-controls.js"></script>
    <script src="js/background-handler.js"></script>
    </body>
</html>

NicolasDreux

18 juin 2019 à 0:36:21

Bonsoir.

La je ne suis actuellement plus sur mon Pc je verrais demain merci beaucoup pour votre aide.

Les span n'étaient pas créer par moi car le fichier est viens d'un script écrit par un programmeur sûrement beaucoup mieux expérimenté que moi.

Après rien m'empêche de régler cette erreur.

Pour les images je pense effectivement qu'il doivent se trouver dans un autre fichier js car en jeu ils affichent correctement les images.

Pour la barre de chargement je n'ai jamais utilisé d'onc j'imagine que main avait rien a faire la .

Moi ce que j'ai essayé de faire c'est juste d'apporter du texte pour informez l'utilisateur donc j'ai juste un peu modifié le fichier rien de plus.

Bonjour.

je viens de tester la correction du script mais sa ne fonctionne pas .

je n'ai pas d'erreur JS dans la console mais sa affiche rien nom plu d'en la div

-
Edité par NicolasDreux 18 juin 2019 à 7:23:00

NicolasDreux

19 juin 2019 à 7:57:09

Bonjour.

Je n'ai toujours pas trouvé depuis la dernière fois le script fonctionne pas.

AbcAbc6

19 juin 2019 à 8:50:34

Bonjour, comment? affiche cette page, tu vois bien les messages qui change!

Ton jeu respecte la norme ECMAScript 2015?? Si non remplace const et let par var pour voir.

Si cela ne fonctionne pas, il faut s'assurer que ton jeu respecte les normes de JavaScript.

NicolasDreux

19 juin 2019 à 9:32:46

je viens de tester en copient la page html toujours le même résultat.

je suis sur le jeu GTA5 j’ignore totalement si ils respect la norme ECMAScript 2015 se pendent j'ai essayer de changer const et let sen resultat )=

AbcAbc6

19 juin 2019 à 9:38:40

Désolé, je ne peux t'aider plus, je ne sais pas comment est fait GTA5.