2013-02-17 114 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(); 

注意,第二个警报会显示你的窗口对象,而不是邻对象