Afficher/masquer un message en JavaScript

Résolu/Fermé
Landreau450 Messages postés 17 Date d'inscription jeudi 19 juillet 2018 Statut Membre Dernière intervention 2 mai 2020 - Modifié le 12 oct. 2018 à 11:19
Landreau450 Messages postés 17 Date d'inscription jeudi 19 juillet 2018 Statut Membre Dernière intervention 2 mai 2020 - 15 oct. 2018 à 00:20
Bonjour, depuis hier je galère sur Google en cherchant comment afficher un message et au bout de 8 secondes le message disparaît. Ce message ne doit plus s'afficher même si l'utilisateur actualise la page. Je suis entrein de créer un site web, et sur ce site si un visiteur arrive, un message lui sera afficher pour l'expliquer comment le site marche et au bout de quelques minutes le message disparaît et ne lui sera plus afficher car son adresse ip sera reconnu. voici un bout de code que j'ai fais, ce code fait apparaître et disparaitre un message, mais lorsque la page est actualisée le message réapparaît et disparaît encore.


<div id="fermer"></div>
 

document.getElementById("fermer").innerHTML="Message à afficher ";
 
setTimeout(function(){
    document.getElementById("fermer").innerHTML="";
},8000);


J'ai sérieusement besoin de votre aide ! Merci!


EDIT : Correction des balises de code pour avoir la coloration syntaxique.
A voir également:

1 réponse

jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
12 oct. 2018 à 11:23
Bonjour,


ce code fait apparaître et disparaitre un message, mais lorsque la page est actualisée le message réapparaît et disparaît encore.

Ben oui... comment penses tu "mémoriser" le fait que l'utilisateur l'a déjà eu ou non ?
Le plus simple serait d'utiliser un COOKIE.

En gros, ouverture de la page.
Si le COOKIE existe.. ne pas afficher le message
Si le COOKIE n'existe pas, afficher le message + création du COOKIE.


Ces deux fonctions devraient t'y aider.
function creerCookie(nom, valeur, jours) {
// Le nombre de jours est spécifié
        if (jours) {
var date = new Date();
                // Converti le nombre de jour en millisecondes
date.setTime(date.getTime()+(jours*24*60*60*1000));
var expire = "; expire="+date.toGMTString();
}
        // Aucune valeur de jours spécifiée
else var expire = "";
document.cookie = nom+"="+valeur+expire+"; path=/";
}


function lireCookie(nom) {
// Ajoute le signe égale virgule au nom
        // pour la recherche
        var nom2 = nom + "=";
        // Array contenant tous les cookies
var arrCookies = document.cookie.split(';');
        // Cherche l'array pour le cookie en question
for(var i=0;i < arrCookies.length;i++) {
var a = arrCookies[i];
// Si c'est un espace, enlever
                while (a.charAt(0)==' ') {
                  a = a.substring(1,a.length);
                }
if (c.andexOf(nom2) == 0) {
                  return a.substring(nom2.length,a.length);
                }
}
        // Aucun cookie trouvé
return null;
}



1
Landreau450 Messages postés 17 Date d'inscription jeudi 19 juillet 2018 Statut Membre Dernière intervention 2 mai 2020
12 oct. 2018 à 13:04
Merci Jordane45 pour votre reponse, mais lorsque j'execute le code plus rien ne s'affiche sur le navigateur, le message ne s'affiche même pas une seule fois.

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>

	<!--On crée une div qui aura comme id fermer-->
	<div id="fermer" style="background-color: red; text-align: center;"></div>

	<!--Code JavaScript-->
	<script type="text/javascript"> //Debut du JavaScript
		//On recupère l'id de la balise div avec la fonction getElementById puis on afficher un message avec innerHTML
		document.getElementById("fermer").innerHTML = "Message supprimé";

		setTimeout(function(){
			//On recupère l'id de la balise div avec la fonction getElementById puis on afficher un message vide avec innerHTML au bout de 5 secondes
			document.getElementById("fermer").innerHTML="";
			},5000 //le temps en milli secondes
			);



		function creerCookie(nom, valeur, 1){
			//Le nombre de jours est spécifié
			if (jours) {
				var date = new Date();
				//Converti le nombre de jour en millisecondes
				date.setTime(date.getTime()+(jours*24*60*60*1000));
				var expire = "; expire=" +date.toGMTString();
			}
			//Aucune valeur de jours spécifiée
			else var expire = "";
			document.cookie = nom+"="+valeur+expire+": path=/";
		}


		function lireCookie(nom){
			//Ajoute le signe égale virgule au nom pour la recherche
			var nom2 = nom + "=";
			//Array contenant tous les cookies
			var arrCookies = document.cookie.split(';');
			//Cherche l'array pour le cookie en question
			for (var i = 0; i < arrCookies.length; i++) {
				var a = arrCookies[i];
				//Si c'est un espace, enlever
				while(a.charAt(0)==' '){
					a = a.substring(1.a.length);
				}
				if (c.andexOf(nom2)==0) {
					return a.substring(nom2.length.a.length);
				}
			}
			//Aucun cookie trouvé
			return null;
		}
	</script>
</body>
</html>
0
Landreau450 Messages postés 17 Date d'inscription jeudi 19 juillet 2018 Statut Membre Dernière intervention 2 mai 2020
12 oct. 2018 à 13:06
Au faite je n'ai jamais utilisé de cookies, je connait que les sessions en php
0
jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
12 oct. 2018 à 14:08
Tu n'as jamais utilisé de fonction non plus visiblement...... ni la console de ton navigateur pour debuguer tes codes ....

Le code que je t'ai donné... tu ne dois pas le modifier !
par contre tu dois l’appeler dans ton code....

Toi tu as remplacer
function creerCookie(nom, valeur, jours) {

par
function creerCookie(nom, valeur, 1){


Non ! il faut laisser les paramètres tels qu'ils sont écrit.
mais dans ton code, tu peux faire appel à la fonction en écrivant
creerCookie("dejalu",1, 1);


Et pour lire le cookie si il existe
if (lireCookie("dejalu") == 1 ){
  alert("Le cookie existe");
}
0
Landreau450 Messages postés 17 Date d'inscription jeudi 19 juillet 2018 Statut Membre Dernière intervention 2 mai 2020
15 oct. 2018 à 00:20
Merci Jordane45 ton code marche bien, merci bien
0