0
我有一个骨干视图,其中我想在视图初始化时触发事件resizeMovieFrame
。它对$(window).on("load", @resizeMovieFrame)
作出反应,因为'hello'显示在控制台中。窗口加载不改变内容
但是,调整大小的代码不会对加载做任何事情。但是,当我调整我的浏览器时,它确实有效。所以我想,当$(window).on("resize", @resizeMovieFrame)
被解雇时,没有任何.movie-frame
div可以调整大小。如果是这种情况,那么propper加载顺序是什么?
class Movieseat.Views.MovieseatsIndex extends Backbone.View
template: JST['movieseats/index']
id: 'something'
initialize: ->
@listenTo @collection, 'change', @renderEntries, this
@listenTo @collection, 'add', @renderEntries, this
@listenTo @collection, 'destroy', @renderEntries, this
$(window).on("resize", @resizeMovieFrame)
$(window).on("load", @resizeMovieFrame)
render: ->
$(@el).html(@template(entries: @collection))
this
events: ->
"click li": "addEntry"
"click .remove": "destroyEntry"
addEntry: (e) ->
movie_title = $(e.target).parent().find('.movie-title').text()
poster_path = $(e.target).parent().find('img').attr('src')
release_date = $(e.target).parent().find('.release_date').text()
console.log poster_path
@collection.create title: movie_title, image: poster_path, release_date: release_date
destroyEntry: (e) ->
thisid = @$(e.currentTarget).closest('div').parent().data('id')
@collection.get(thisid).destroy()
renderEntries: (entry) ->
view = new Movieseat.Views.Showmovie(collection: @collection)
$('#movie-container').html(view.render().el)
resizeMovieFrame: ->
equalheight = (container) ->
currentTallest = 0
currentRowStart = 0
rowDivs = new Array()
$el = undefined
topPosition = 0
$(container).each ->
$el = $(this)
$($el).height "auto"
topPostion = $el.position().top
unless currentRowStart is topPostion
currentDiv = 0
while currentDiv < rowDivs.length
rowDivs[currentDiv].height currentTallest
currentDiv++
rowDivs.length = 0 # empty the array
currentRowStart = topPostion
currentTallest = $el.height()
rowDivs.push $el
else
rowDivs.push $el
currentTallest = (if (currentTallest < $el.height()) then ($el.height()) else (currentTallest))
currentDiv = 0
while currentDiv < rowDivs.length
rowDivs[currentDiv].height currentTallest
currentDiv++
return
return
$(window).load ->
equalheight ".movie-frame"
return
$(window).resize ->
equalheight ".movie-frame"
return
console.log ('hello')
的resizeMovieFrame
事件重新调整所有.movie-frame
的div到相同的高度。