2014-02-16 58 views
0

這裏是我的代碼:的setInterval不會在Chrome中工作(工作僅第一次)

var $cur = 0; 
$(document).ready(function (e) { 
    $tot = document.getElementsByTagName("img").length; 
    changetile(); 
}); 

function changetile() { 
    if ($cur == $tot) { 
     $next = 1; 
    } else { 
     $next = $cur + 1; 
    } 
    $("#tile-" + $cur).fadeOut(1000); 
    $("#tile-" + $next).fadeIn(1000); 
    $cur = $next; 
} 
var myVar = setInterval(function() { 
    changetile() 
}, 4500); 

此代碼不能在Chrome中使用(它的作品第一次)。我能做些什麼來解決它?

+0

移動一切準備好文件。 – leaf

+0

然後用'var myVar = setInterval(changetile,4000)保存一些空間' – mplungjan

回答

1

$tot有本地範圍不能在塊外訪問。

DOM就緒($(document).ready(function(){)具有匿名功能,因此您的$tot變量具有局部範圍

把你所有的代碼DOM已準備就緒

var $cur = 0; 
$(document).ready(function (e) { 
    $tot = document.getElementsByTagName("img").length; 
    function changetile() { 
     if ($cur == $tot) { 
      $next = 1; 
     } else { 
      $next = $cur + 1; 
     } 
     $("#tile-" + $cur).fadeOut(1000); 
     $("#tile-" + $next).fadeIn(1000); 
     $cur = $next; 
    } 
    var myVar = setInterval(function() { 
     changetile() 
    }, 4500); 
    changetile(); 
}); 

讀取裏面What is the scope of variables in JavaScript?

+0

我對'$ tot'懷疑爲* local * var,你能否檢查'function f(){v = 1;}; F(); v;'? Chrome說'1'。 – leaf

0
var $cur = 0; 
$(document).ready(function (e) { 

    var myVar = setInterval(function() { 
     $tot = document.getElementsByTagName("img").length; 
     changetile() 
}, 4500); 
}); 

function changetile() { 
    if ($cur == $tot) { 
     $next = 1; 
    } else { 
     $next = $cur + 1; 
    } 
    $("#tile-" + $cur).fadeOut(1000); 
    $("#tile-" + $next).fadeIn(1000); 
    $cur = $next; 
} 

更改您的密碼喜歡這個。它將工作

0

你的代碼是工程在我的瀏覽器(Chrome):

但你它不是,那麼你應該嘗試使用此:

var $cur = 0,$tot; 
$(document).ready(function (e) { 
$tot = document.getElementsByTagName("img").length; 
var myVar = setInterval(changetile,4500); 
}); 
function changetile() { 
if ($cur == $tot) { 
    $next = 1; 
} else { 
    $next = $cur + 1; 
} 
$("#tile-" + $cur).fadeOut(1000); 
$("#tile-" + $next).fadeIn(1000); 
$cur = $next; 
} 
0

這不是瀏覽器的問題 - 這是你的代碼的問題。這是我得到的輸出:

第一次迭代

薑黃素= TOT! VM325:14

薑黃素= 0 $ TOT = 9 VM325:16

下一頁val爲:1 VM325:17

第二次迭代:

薑黃素=托特! VM325:14

薑黃素= 1 $ TOT = 9 VM325:16

下一頁val爲:2 VM325:17

THRID:

薑黃素= TOT! VM325:14

的Cur = 2 $ TOT = 9 VM325:16

下一頁val爲:3 VM325:17

我簡單地把一些控制檯得到這個。登錄有報表,看看發生了什麼事情:

$(document).ready(function (e) { 
    $tot = document.getElementsByTagName("img").length; 
    changetile(); 
}); 

function changetile() { 
    if ($cur == $tot) { 
     $next = 1; 
    console.log(" Cur == tot! "); 
    } else { 
     $next = $cur + 1; 
    console.log(" Cur != tot! "); 
    } 
    console.log("Cur = " + $cur + " $tot = " + $tot); 
    console.log(" Next val is : " + $next) 

    $cur = $next; 
} 
var myVar = setInterval(changetile, 4500); 

編輯:@圖莎爾 - 古普塔使雅答案=]我只是爲你指明方向(如果你只是需要一個指針)