0

我正在为 jQuery 制作一个插件,我需要在一些动画完成后重新运行相同的功能。我正在尝试setTimeout()在 animate 函数中执行此操作。

我正在努力的代码在底部是

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

控制台错误消息是Uncaught TypeError: Object [object Window] has no method '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();

};
4

2 回答 2

1

切勿setTimeout与要eval编辑的代码字符串一起使用!此外,您的this参考将不是来自父函数的参考。

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

顺便说一句,您可能希望使用带有回调的 jQuerydelay方法,而不是独立的超时。

于 2013-02-17T12:58:06.777 回答
0

这是因为 javascript 中的this与 i Java 不同。 是本例中的窗口对象。

你可以使用闭包来避免这个问题:

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


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

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

请注意,第二个警报将向您显示 window-object,而不是 o-object

于 2013-02-17T13:01:21.023 回答