2013-02-17 85 views
0

我正在爲jQuery製作一個插件,我需要在一些動畫完成後重新運行相同的功能。我試圖在動畫功能中使用setTimeout()來完成此操作。jQuery在動畫中運行父功能

我與掙扎的代碼是在底部

jQuery(theslide).animate(theanimation,1000,function() { 
     setTimeout('this.makemeslide()',3000) 
}) 

控制檯錯誤消息是未捕獲的類型錯誤:對象[對象窗口]沒有方法「makemeslide」這使得因爲看到這指向動畫對象。但我不知道如何實現我的目標。

這裏我完整的代碼

jQuery.fn.daSlider = function(options) { 
    //Options 
    var settings = $.extend({ 
      'selector'   : 'slider', 
      'width'  : 940, 
      'height'  : 380 
     }, options); 

    //globals 
    var sliderarray = []; 
    var slidercount = 0; 


    //Contruct 
    this.construct = function() 
    { 
     jQuery('.slider .slide').each(function(){ 

       jQuery(this).css('display','none'); 
       sliderarray.push(this) ; 

       jQuery(this).children().each(function(){ 
        jQuery(this).css('display','none'); 
        sliderarray.push(this) ; 
       }); 
     }); 

     this.makemeslide(); 
    } 
    //run the constuct 

    this.makemeslide = function() 
    { 
     theslide = sliderarray[slidercount]; 
     slidercount++; 

     way_to_slide = jQuery(theslide).attr('slide'); 

     slide_position = jQuery(theslide).position(); 
     //console.log(slide_width); 
     //console.log(slide_height); 


     if(way_to_slide == 'right') 
     { 
     jQuery(theslide).css('left', slide_position.left + settings.width); 
     theanimation = {'left' : '-='+settings.width}; 
     } 
     if(way_to_slide == 'left') 
     { 
     jQuery(theslide).css('left', slide_position.left - settings.width); 
     theanimation = {'left' : '+='+settings.width}; 
     } 
     if(way_to_slide == 'up') 
     { 
     jQuery(theslide).css('top', slide_position.top - settings.height); 
     theanimation = {'top' : '+='+settings.height}; 
     } 
     if(way_to_slide == 'down') 
     { 
     jQuery(theslide).css('top', slide_position.top + settings.height); 
     theanimation = {'top' : '-='+settings.height}; 
     } 
     if(way_to_slide == 'fade') 
     { 
     jQuery(theslide).css('opacity', 0); 
     theanimation = {'opacity' : 1}; 
     } 

     jQuery(theslide).css('display','block') ; 
     jQuery(theslide).animate(theanimation,1000,function(){setTimeout('this.makemeslide()',3000)}) 

    } 
    this.construct(); 

}; 
+0

你能指望什麼'this'是?這是您將這些'makemeslide'和'construct'屬性分配給的jQuery包裝器對象。 – Bergi 2013-02-17 13:04:16

+0

感謝所有幫助過的人 – 2013-02-17 13:06:54

回答

1

不要從不使用setTimeout的代碼串是eval版!另外,您的this reference不會是父功能中的一個。

var plugin = this; 
jQuery(theslide).animate(theanimation, 1000, function() { 
    // "this" references theslide element 
    setTimeout(function() { 
     // "this" references the global object (window) 
     plugin.makemeslide(); 
    }, 3000); 
}); 

順便說一句,而不是一個獨立的超時時間,你可能想使用jQuery's delay method與回調。

+0

這真是太棒了。有效。你們真是太好了:D – 2013-02-17 13:03:35

+0

我看過延遲功能 – 2013-02-17 13:05:50

0

這是因爲 這個在javascript中與我的Java不一樣。 這個是這種情況下的窗口對象。

你可以使用閉包來避免這個問題:

function Object(){ 
    self=this; 
    this.inner = function(){ 


    setTimeout(function(){ 
     alert(self); 
     alert(this); 
    },100); 
    } 
} 

var o = new Object(); 
o.inner(); 

注意,第二個警報會顯示你的窗口對象,而不是鄰對象