2014-10-30 91 views
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到相同的高度。

回答

0

您可能需要绑定resizeWindowFrame函数的上下文。

resizeMovieFrame: =>