javascript - setInterval為什麼只執行一次
黄舟
黄舟 2017-06-30 09:55:19
0
7
982
  • 簡單的背景切換

#jquery部分

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

            setInterval(direct,1000);
        })

html部分

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

css部分

.bg2預設display:none;

  • setInterval()只執行了一次,就想問為啥進入不了第二次?

#各位大佬不要鄙視我,感謝您的解答~

黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

全部回覆(7)
ringa_lee

不是鄙視你,但這明顯是語法問題……實際上我認為setInterval 一直都在執行,但是你的函數direct 的運行結果是固定的,循環的最終結果是第二張顯示第一張隱藏,所以看起來好像沒執行一樣。

你應該這樣做:

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

這裡用到了閉包,把狀態保存在定時器的外面,才能夠每次往下循環。

另外再補充一點渲染的知識。對於這種用 for 循環改變視圖狀態,瀏覽器會把這些狀態都緩存起來,然後擇機渲染,而不是你一修改它就立刻渲染。所以你連閃一下都看不到。

学习ing

參考一下

$(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);
})
習慣沉默

setInterval(function direct(){

雷雷
滿天的星座

循環一次之後i的值為1 然後就一直是1 用let試試

过去多啦不再A梦

你是不是要的這種效果,依序一個一個顯示?

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);
});
为情所困

$(函數(){

雷雷

})

滿天的星座
setInterval(direct(),1000);

不知道對不對,但總覺得是這個的問題

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板