se passer d'un SetTimeout dans Jquery

Consultez la formation SEO spéciale Wordpress
par WebRankInfo / Ranking Metrics

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

se passer d'un SetTimeout dans Jquery

Message le Jeu Fév 23, 2017 18:57

Bonjour,

je souhaite savoir si cela est possible de se passer du SetTimeout que j'ai été obligé d'appliquer, car sinon lors du clic sur le bouton, le data apparait directement et les effets s'execute ensuite, ce que je ne veut évidement pas avoir. Je souhaite une chronologie comme ceci :

Clic
Fadeout du contenu actuel
Fadein du data

La chronologie actuelle est comme cela

Clic
Affichage du data (pas de fadein)
Fadeout du data
Fadein du data

Code: Tout sélectionner
//Form block parameters
$("#button_parameters_basics").click(function() {

   $("#button_parameters_basics").attr("disabled", true);
   $('#form_parameters').delay(0).fadeOut(500);
   
   setTimeout(function () {
      $.ajax({
type: 'POST',
url: '?mod=parameters_basics',
data: {
referrer: $('#referrer').val(),
proxy: $('#proxy').val()
         },
success: function(data){
            
            $('.form').empty().hide().delay(500).fadeIn(500).append(data);
         }
      });
   }, 500);
   
   return false;
});


Le setTimeout permet de bloquer pendant une demi seconde le data afin que le Fadeout s'execute normalement.

Y a t'il une autre solution ?

Merci


niap
WRInaute discret
WRInaute discret
 
Messages: 137
Enregistré le: 17 Oct 2009

Re: se passer d'un SetTimeout dans Jquery

Message le Jeu Fév 23, 2017 19:36

Oui, tu peux ajouter un callback sur la fonction fadeOut. Ca évitera tout tes delay.
Code: Tout sélectionner
$("#monBloc").fadeOut(500, function(){
// ici place la requette ajax
// elle sera appellé une fois le fadeOut terminé
});



Code: Tout sélectionner
$('.form').empty().hide().delay(500).fadeIn(500).append(data);

Plutôt que d'effacer, masquer, attendre, faire un fondu et ajouter les données, tu peux masquer, remplacer les données, faire ton fondu
Code: Tout sélectionner
$('.form').hide().html(data).fadeIn(500);

A testé, j'ai pas touché jQuery depuis quelques temps, mais tu as l'idée.

sff
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 460
Enregistré le: 2 Fév 2005

Re: se passer d'un SetTimeout dans Jquery

Message le Jeu Fév 23, 2017 19:49

Oui cela fonctionne parfaitement. Je ne connaissais pas le callback, ca risque de me servir, c'est plus propre.

Merci


Formation recommandée sur ce thème :

Formation SEO spéciale Wordpress : apprenez à optimiser le référencement naturel d'un site fait avec Wordpress... Formation Ranking Metrics animée par un expert SEO / Wordpress.

Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.

Lectures recommandées sur ce thème :