TypeError:'requestAnimationFrame'在没有实现接口Window的对象上调用

时间:2017-02-19 00:25:48

标签: javascript

我正在将setInterval代码转换为requestAnimationFrame。我在一个类中使用它所以我需要将this绑定到传递的函数。

当我为变量(this.raf)分配正确的供应商函数时,我收到错误:

  

TypeError:'requestAnimationFrame'在没有的对象上调用   实现界面窗口。

直接调用window.requestAnimationFrame时代码正常。任何想法为什么错误?

这是a fiddle

slideshow = (function() {
  function slideshow() {
    this.slideShowRunning = false;
    this.slide = 0;
  }

  slideshow.prototype.startSlideshow = function() {
    var newSlide;
    this.slideShowRunning = true;
    this.rafId;
    this.raf = window.requestAnimationFrame ||
      window.mozRequestAnimationFrame ||
      window.webkitRequestAnimationFrame ||
      window.msRequestAnimationFrame ||
      window.oRequestAnimationFrame;

    function loop() {
      // stop the loop if fn returned false
      if (this.slideShowRunning !== false) {
        if (this.slide < this.count - 1) {
          newSlide = this.slide + 1;
        }
        this.loadSlide(newSlide);
        // loop until cancelled
        var boundLoop = loop.bind(this);

        // THIS GIVES THE ERROR
        this.rafId = this.raf(boundLoop);

        // BUT THIS WORKS
        //this.rafId = window.requestAnimationFrame(boundLoop);
      }
    }
    var boundLoop = loop.bind(this);
    boundLoop();
  }

  slideshow.prototype.loadSlide = function(slideNumber) {
    // loading the slide
    console.log(slideNumber);
  }

  return slideshow;

})();

ss = new slideshow();
divStart = document.getElementById("start");
divStart.onclick = function() {
  ss.startSlideshow()
};

0 个答案:

没有答案