Utilizzo di setTimeout per ritardare i tempi delle azioni jQuery

Sto tentando di ritardare lo scambio di testo in un div. Dovrebbe funzionare come un cursore/carosello per il testo.Utilizzo di setTimeout per ritardare i tempi delle azioni jQuery

Devo avere il codice sbagliato, poiché la sostituzione del testo finale non avviene mai.

Inoltre, come animare l'introduzione del testo sostitutivo (tapparelle, ad es.)?

<html> 
    <head> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
     <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" /> 

     <script type="text/javascript"> 
$(document).ready(function() { 

    $("#showDiv").click(function() { 
     $('#theDiv').show(1000, function() { 
      setTimeout(function() { 
       $('#theDiv').html('Here is some replacement text', function() { 
        setTimeout(function() { 
         $('#theDiv').html('More replacement text goes here'); 
        }, 2500); 
       }); 
      }, 2500); 
     }); 
    }); //click function ends 

}); //END $(document).ready() 

     </script> 
    </head> 
<body> 

    Below me is a DIV called "theDiv".<br><br> 
    <div id="theDiv" style="background-color:yellow;display:none;width:30%;margin:0 auto;"> 
     This text is inside the Div called "theDiv". 
    </div><br> 
    <br> 
    <input type="button" id="showDiv" value="Show DIV"> 



</body> 
</html>

fonte

2013-06-05 gibberish

la più appropriata lo strumento per questo sarebbe '.queue()' Penso che ... – Shikkediel

.html() richiede solo una stringa o una funzione come argomento, not both. Prova questo:

$("#showDiv").click(function() { 
    $('#theDiv').show(1000, function() { 
     setTimeout(function() { 
      $('#theDiv').html(function() { 
       setTimeout(function() { 
        $('#theDiv').html('Here is some replacement text'); 
       }, 0); 
       setTimeout(function() { 
        $('#theDiv').html('More replacement text goes here'); 
       }, 2500); 
      }); 
     }, 2500); 
    }); 
}); //click function ends

jsFiddle example

fonte

2013-06-05 17:08:57 j08691

cosa succede se metto uno all'interno di quel div ... lo script verrà anche aggiornato? o qualcosa. – Vincent

È anche possibile utilizzare al posto di jQuery's delay() methodsetTimeout(). Ti darà un codice molto più leggibile. Ecco un esempio dalla documentazione:

$("#foo").slideUp(300).delay(800).fadeIn(400);

L'unica limitazione (che io sappia) è che non ti dà un modo per cancellare il timeout. Se è necessario farlo, è meglio attenersi a tutti i callback nidificati che si applicano a setTimeout.

fonte

2014-05-22 18:29:28 iconoclast

In realtà, è possibile usare 'clearQueue()' per rimuovere eventuali animazioni che non sono state ancora eseguite. – Shikkediel

Prova questo:

function explode(){ 
    alert("Boom!"); 
} 
setTimeout(explode, 2000);

fonte

2015-11-21 08:26:41 Leon

Ecco come ho risolto il problema Il menu si chiude pochi secondi dopo il mouse fuori (che se hover non è scattato),

$setM_swith=0; //Set timer switch 
$(function(){ 
     $(".navbar-nav li a").click(function(event) { 
      if (!$(this).parent().hasClass('dropdown')) 
       $(".navbar-collapse").collapse('hide'); 
     }); 
     $(".navbar-collapse").mouseleave(function(){ 
      $setM_swith=1; 
      setTimeout(function(){ if($setM_swith==1){$(".navbar-collapse").collapse('hide');$setM_swith=0;} }, 3000); 
     }); 
     $(".navbar-collapse").mouseover(function(){ 
      $setM_swith=0; 
     }); 
    });

fonte

2016-09-15 18:39:45

scusami posto sbagliato :( –

Utilizzo di setTimeout per ritardare i tempi delle azioni jQuery

risposta

Problemi correlati