IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

SetTimeout dans each


Sujet :

jQuery

  1. #1
    Membre averti
    Homme Profil pro
    Inscrit en
    Juin 2011
    Messages
    41
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Suisse

    Informations forums :
    Inscription : Juin 2011
    Messages : 41
    Par défaut SetTimeout dans each
    Bonjour,

    J'ai un problème lorsque je tente de mettre des setTimeout à l'intérieur de each().

    Je sais que ce problème est tout à fait normal puisque chaque fois que le each() se répète il efface l'ancien setTimeout() mais je ne sais pas comment trouver une solution ^^'

    Voici mon code :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    jQuery(".WindowStyle").each(function(){
    setTimeout(function(){jQuery(this).hide();},500);
    });
    Merci d'avance,

    7804j

  2. #2
    Membre averti
    Homme Profil pro
    Inscrit en
    Juin 2011
    Messages
    41
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Suisse

    Informations forums :
    Inscription : Juin 2011
    Messages : 41
    Par défaut
    J'ai essayé avec delay, mais cela ne fonctionne pas car l'effet s'exécute immédiatement sans attendre le délai demandé :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    jQuery(".WindowStyle").each(function(){
    jQuery(this).delay(500).hide()
    });
    Aurais-je fait une erreur ?

  3. #3
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Bonjour

    [...] Je sais que ce problème est tout à fait normal puisque chaque fois que le each() se répète il efface l'ancien setTimeout() [...]
    J'ai réalisé un test, mais j'étais persuadé que le bon fonctionnement de la méthode setTimeout de l'objet window n'était pas dépendant de sa situation dans la méthode each().

    Il se répète simplement autant de fois qu'il y a d'item à parcourir. En fait on obtient une espèce de setInterval qui ne s'exécute qu'un nombre prédéterminé de fois.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    <!doctype html>
    <html lang="fr">
    <head>
    	<meta charset="utf-8">
    	<meta name="Author" content="Daniel Hagnoul">
    	<title>Forum jQuery</title>
    	<link href='http://fonts.googleapis.com/css?family=Redressed&subset=latin&v2' rel='stylesheet' type='text/css'>
    	<style>
    		/* Base */
    		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img {margin:0; padding:0; }
    		body {background-color:rgba(210, 214, 98, 0.5); color:#000000; font-family:sans-serif; font-size:medium; font-style:normal; font-weight:normal; line-height:normal; letter-spacing:normal; }
    		h1,h2,h3,h4,h5 {font-family:'Redressed', cursive; padding:6px; }
    		p, div, td {word-wrap:break-word; }
    		pre, code {white-space:pre-wrap; word-wrap:break-word; }
    		img, input, textarea, select {max-width:100%; }
            img {border:none; }
    		h1 {font-size:2em; text-shadow: 4px 4px 4px #bbbbbb; text-align:center; }
    		p {padding:6px; }
            ul,ol,dl {list-style:none; padding-left:6px; padding-top:6px; }
            li {padding-bottom:6px; }
    		.conteneur {width:95%; min-width:800px; min-height:300px; margin:12px auto; background-color:#ffffff; color:#000000; border:1px solid #666666; }
     
    		/* -- */
    	</style>
    </head>
    <body>	
    	<h1>Forum jQuery</h1>
    	<section class="conteneur">
    		<p id="testID">Un mot pour remplir</p>
    	</section>
    	<footer itemscope itemtype="http://data-vocabulary.org/Person">
    		<time datetime="2011-07-12T17:15:00.000+02:00" pubdate>2011-07-12</time> <span itemprop="name">Daniel Hagnoul</span> <a href="http://www.developpez.net/forums/u285162/danielhagnoul/" itemprop="url">@danielhagnoul</a>
    	</footer>
    	<script charset="utf-8" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
    	<script>
    		$(function(){
    			/* -- */
     
    			var bool = true,
    				objTest = $("#testID"),
    				n = 0,
    				objsInBody = $("*", "body")
    				taille = objsInBody.length;
     
    			$.each(objsInBody, function(i, item){
    				console.log("i = ", i, ", item = ", item);
     
    				window.setTimeout(function(){
    					if (bool){
    						bool = false;
    						n++;
    						objTest.fadeIn(1500);
    					} else {
    						bool = true;
    						n++;
    						objTest.fadeOut(1500);
    					}
     
    					console.log("n = ", n);
    				}, 2000);
    			});
    		});
    	</script>
    </body>  
    </html>
    Mon test s'exécute dans tous les navigateurs récents, mais, bien entendu, dans mon test le nombre d'itérations dépend du nombre de noeuds (node) dans la partie du DOM qui représente le body. Et ce nombre varie en fonction des navigateurs. C'est la raison pour laquelle on ne doit jamais faire un "next().next()" ou un "prev()prev()" !

    Le comportement du setTimeout dans un each() est donc parfaitement logique.

    Je crois que si ce comportement ne vous convient pas c'est qu'il a un problème de conception, mais sans le contexte (HTML, CSS, JS, et jQuery) de votre problème...

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  4. #4
    Membre averti
    Homme Profil pro
    Inscrit en
    Juin 2011
    Messages
    41
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Suisse

    Informations forums :
    Inscription : Juin 2011
    Messages : 41
    Par défaut
    La question n'était pas de savoir si le comportement était logique ou pas mais justement d'en trouver une solution.

    Quoi qu'il en soit, j'ai de toute manière procédé autrement afin de ne pas avoir à utiliser de setTimeout.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Messagebox personnel Settimeout dans le onload
    Par cincap dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 20/04/2014, 13h27
  2. Delai (setTimeout) dans un toggle() rempli d'ajax
    Par franquis dans le forum jQuery
    Réponses: 1
    Dernier message: 07/10/2010, 15h48
  3. [XML-XPATH] Problème dans un for each
    Par stailer dans le forum XSL/XSLT/XPATH
    Réponses: 1
    Dernier message: 26/12/2005, 12h11
  4. [xslt] For-each dans template avec format XML (row)
    Par Steff1985 dans le forum XSL/XSLT/XPATH
    Réponses: 2
    Dernier message: 17/11/2005, 11h14
  5. [XSL-FO] Modifer une structure de tableau dans for-each
    Par serwol dans le forum XSL/XSLT/XPATH
    Réponses: 24
    Dernier message: 17/06/2005, 17h38

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo