今天在做一個項目的時候,遇到了一個小問題,可把我糾結了半天,問題如下:
Base.prototype.move_over=function(arr,_time){
for(var i=0;i<this.elements.length;i++){
var _this=this;
var _thisElements=this.elements[i];
_thisElements.οnmοuseοver=function(){
action();
var next=0;
function action(){
if(next<arr.length){
_this.css('backgroundImage','url('+arr[next]+')')
next++;
}
alert(this);
setTimeout('action()',_time);
}
}
}
return this;
}
我是寫了一個setTimeout函數來執行action()函數,以達到圖片更換的目的,但是發現控制檯action報錯not defined,搞得我一頭霧水,難道action函數不能被執行嗎?
想了半天終於想通了原因,原來是因爲setTimeout執行過後,作用域已經變成了window,而不是依然在函數內部執行,而setTimeout的延遲是在後臺被掛起運行,等到延遲一到,再執行的環境就是window了,然後執行的時候就在window下尋找可以執行的函數action(),未找到便出現了這樣報錯的結果。那麼怎麼去解決這一事情呢。
steTimeout函數機制就是用eval執行第一個參數'action()"字符串,既然action()字符串不存在,那麼我把它換成了一個對象action進行測試,更換代碼如下:
setTimeout(action,_time)
運行,測試成功。