window.requestAnimationFrame 的独特触发

Question

我正在使用函数 window.requestAnimationFrame。

我不知道为什么，但不是连续触发，而是在我点击时触发一次 'Play'

html 是

<button id='play'>Play</button>
<button id='pause'>Pause</button>

coffeeScript中的代码

class Counter
  i:0
  init: () ->
    $('#play').click @fire.bind(@)
    $('#pause').click @unfire.bind(@)
  fire:() ->
    window.requestAnimationFrame @update.bind(@)
  unfire:() ->
    window.cancelAnimationFrame @update.bind(@)
  update: () ->
    $('h1').remove()
    $('<h1></h1>').appendTo 'body'
    $('h1').text @i
    @i++

tick = new Counter()
tick.init()

代码笔中的脚本：http://codepen.io/helloncanella/pen/mJrwwP?editors=101

Answer 1

已解决。

我忘记在更新函数中调用 window.requestAnimationFrame @update.bind(@)

Answer 2

class Banana
  i:0
  animation: null

  init: () ->
    $('#play').click @fire.bind(@)
    $('#pause').click @unfire.bind(@)

    console.log @fire
  fire:() ->
    @animation = requestAnimationFrame(@update.bind(@))
  unfire:() ->
    cancelAnimationFrame(@animation)
  update: () ->
    $('h1').text @i
    $('<h1></h1>').appendTo 'body'
    @i++
    @animation = requestAnimationFrame(@update.bind(@))

fruit = new Banana()
fruit.init()

window.requestAnimationFrame 的独特触发

Unique triggering of window.requestAnimationFrame

javascript

coffeescript