javascript - Pourquoi setInterval n'est-il exécuté qu'une seule fois?

Question

• Changement d'arrière-plan simple

partie jquery

$(function(){
            
            function direct(){
                
                for(var i=0;i<2;i++){
                $(".bg_img").eq(i).show().siblings().hide();
                }
            }

            setInterval(direct,1000);
        })

partie HTML

<p class="main_bg">
        <p class="bg_img bg1"></p>
        <p class="bg_img bg2"></p>
    </p>

partie CSS

.bg2 affichage par défaut : aucun ;

• setInterval() n'a été exécuté qu'une seule fois, je voudrais donc demander pourquoi il ne peut pas être saisi une deuxième fois ?

Tout le monde, ne me méprisez pas, merci pour vos réponses~

Answer 1

Je ne veux pas vous mépriser, mais c'est évidemment un problème de syntaxe... En fait, je pense que setInterval est toujours exécuté, mais le résultat d'exécution de votre fonction direct est corrigé. Le résultat final de la boucle est que la deuxième image est affichée. et la première image est masquée, il semble donc qu'elle ne soit pas implémentée.

Tu devrais faire ceci :

var current = 0;
function direct(){
  $(".bg_img").eq(current).show()
    .siblings().hide();
  current++;
  if (current > 1) {
    current = 0;
  }  
}

Une fermeture est utilisée ici pour enregistrer l'état en dehors de la minuterie afin qu'il puisse être bouclé à chaque fois.

Ajoutez également quelques connaissances sur le rendu. Pour que ce type de boucle for change l'état d'affichage, le navigateur mettra en cache ces états puis les restituera à un moment approprié, au lieu de les restituer immédiatement dès que vous le modifiez. Donc on ne peut même pas le voir clignoter.

Answer 2

Veuillez vous y référer

$(function(){
  function direct(i){
    $(".bg_img").eq(i).show().siblings().hide();
  }

  var i = 0;
  setInterval(function () {
    direct(i)
    i = (i + 1) % $(".bg_img").length
  }, 1000);
})

Answer 3

setInterval(function direct(){

            
            for(var i=0;i<2;i++){
            $(".bg_img").eq(i).show().siblings().hide();
            }
        },1000);
      直接这样试试，控制台看看，有没有报错，如果报错的话，js也不会继续执行了的。

Answer 4

Après avoir bouclé une fois, la valeur de i est 1 puis elle reste 1. Essayez d'utiliser let

Answer 5

Voulez-vous que cet effet soit affiché un par un dans l'ordre ?

jQuery(function($){
    var bgImg = $(".bg_img"),
        maxIndex = bgImg.length - 1,
        i = 0;

    function direct(){
        bgImg.eq(i).show().siblings().hide();

        if (i < maxIndex) {
            i++;
        } else {
            i = 0;
        }
    }

    setInterval(direct, 1000);
});

Answer 6

$(fonction(){

var index = 0;
setInterval(function(){
    (index < $('.bg_img').length) ? index ++ : index = 0;
    $('.bg_img').eq(index).show().siblings().hide();
},1000);

})

Answer 7

setInterval(direct(),1000);

Je ne sais pas si c'est vrai, mais j'ai toujours l'impression que c'est là le problème