我正在使用backbone.js编写应用程序,并在页面之间进行动画制作(有点像iphone样式ui)。因此,当您单击按钮时,下一页将从右侧滑入,单击后退按钮将使下一页从左侧滑入。我希望能够使用路由器对浏览器前进和后退按钮执行相同的操作。是否有可能分辨出哪个被按下(向前或向后)以便我可以确保动画的方向正确?
只是为了澄清,我不是问如何进行骨干路由。我在问骨干路由时,你怎么能抓住哪个按钮导致网址改变,是后退按钮还是前进按钮?
由于
答案 0 :(得分:8)
在所有链接上收听点击事件。 (CoffeeScript的)
$(document).on 'click', 'a' ->
window.linkClicked = true
或者,您可以拦截Backbone.history.navigate()
。如果有人点击它,这意味着他们不会返回,因此请设置一个标记true
。您的路由器中还有一个事件可以侦听所有路由器事件。始终存储上一个片段(Backbone.history.getFragment()
)。将当前片段与先前片段进行比较。如果它们相同,请检查该标记是否设置为true
或false
。如果设置为false
,那么您知道它已经回来了,如果true
那么它不是,并且有人点击了一个链接但是来到了同一个上一页。最后,将此标志重置为false
。
class SnazzyRouter extends Backbone.Router
initialize: ->
# This gets triggered everytime a route event gets triggered
@on 'all', =>
currentFragment = Backbone.history.getFragment()
window.backDetected = false # assume no back detected
if !window.linkClicked and currentFragment == window.previousFragment
window.backDetected = true
window.linkClicked = false # reset
window.previousFragment = currentFragment
window.linkClicked = false
window.backDetected = false
window.previousFragment = null
snazzyRouter = new SnazzyRouter()
现在,这是一个简单的
# Did we go back?
console.log "I CAN'T BELIEVE WE WENT BACK!" if window.backDetected
如果您需要任何澄清,请告诉我(我刚刚为我的应用实施了此功能)。