為什么老師用settimeout函數而不用setinterval?為什么setinterval函數里面參數值有變化
在動畫函數那里感覺用setinterval也行,但是很奇怪的是我用setinterval來寫里面一些參數值會發生變化;比如說我setinterval函數寫在前面,后面寫了句index=end(所點擊的小圓點的index),setinterval函數里面有用到index的值,但是函數里面的index值會突變為end的值。。。。
在動畫函數那里感覺用setinterval也行,但是很奇怪的是我用setinterval來寫里面一些參數值會發生變化;比如說我setinterval函數寫在前面,后面寫了句index=end(所點擊的小圓點的index),setinterval函數里面有用到index的值,但是函數里面的index值會突變為end的值。。。。
2016-08-12
舉報
2016-08-12
window.onload = function() {
index=1;//當前頁碼
len=5;//圖片張數
btn = document.getElementsByTagName("span");//獲得眾多小圓點元素
document.getElementsByTagName("span")[0].className="active";//設置第一個小圓點樣式為active
for(var i = 0; i < len; i++) {
btn[i].onclick = function() {
if(this.className=="active"){//如果摁了當前頁面的小圓點,就不執行下面的函數
return;//不能用break;
}
//獲得摁的是第幾個小圓點
pointNum=parseInt(this.getAttribute("index"));//一定要加parseInt
offset=-669*(pointNum-index);//計算位移
function slidepage(offset){//滑動動畫
n =1;
img = document.getElementsByClassName("content")[0];
end=parseInt(img.style.marginTop)+offset;//計算終點
speed=offset/3;
? ? ?setInterval("go(index,pointNum,speed)",40);
? ? ? ??
? ?if(end<-6*669){//如果終點在第6張圖片,就返回第1張圖片
? ?img.style.marginTop=-669+"px";
? ? ? ?}
}
slidepage(offset);
showbutton(pointNum);
}
}
?
}
function showbutton(num){//小圓點的顏色變化
for(var i=0;i<len;i++){
if(btn[i].className=="active"){//清除有active樣式的小圓點的樣式
btn[i].className="";
break;
}
}
index=num;
btn[index-1].className="active";//給當前小圓點添加active樣式
}
function go(index,pointNum,speed){
if(n == 3*(pointNum-index)) {
clearInterval();
}
img.style.marginTop=parseInt(img.style.marginTop)+speed+"px";
n++;
}