問題與EL骨幹視圖

Question

我不明白，爲什麼在我看來EL僅被定義爲loadResults功能，而不是在checkScroll ... 5取決於documentAddEventLIstener（「滾動」，this.checkScroll，這一點）？ 我無法理解的原因

var HomePostView = Backbone.View.extend({ 

    tagName: "ul", 
    // id: "list", 
    // el:$('.table-view'), 
    template: Handlebars.compile(template), 

    events: { 
    'scroll': 'checkScroll' 
    }, 



    initialize: function() { 
    //console.log(this.collection); 
    // this.collection.bind("add", this.render, this); 

    document.addEventListener("scroll", this.checkScroll, this); 
    this.isLoading = false; 
    this.IntegratedCollection= new Integrated(); 
    this.IntegratedCollection.twitterQuery=11265832;//spostare in load results 
     this.IntegratedCollection.fetch(); 
    this.listenTo(this.IntegratedCollection,'add',this.render); 

     console.log((this.el)); 

    }, 



    render:function(){ 

     this.loadResults(); 
    }, 






    loadResults: function (eventName) { 
    console.log((this.el));<-----WELL DEFINED HERE 
    this.isLoading = true; 
     $(this.el).empty(); 
     _.each(this.IntegratedCollection.models, function (a) { 
     $(this.el).append(new SingleHomePostView({ 
      model: a 
     }).render().el); 
     }, this); 
     this.isLoading = false; 
     return this; 


    }, 

    setParameters: function(){ 

     this.IntegratedCollection.page += 1; // Load next page 
     this.IntegratedCollection.twitterQuery=11265832; 
     this.IntegratedCollection.fetch(); 




    }, 

    checkScroll: function() { 


     console.log(this.el);<-----UNDEFINED HERE 
    var triggerPoint = 100; // 100px from the bottom 
    if(!this.isLoading && this.el.scrollTop + this.el.clientHeight + triggerPoint > this.el.scrollHeight) { 
     console.log("inside"); 
    // this.setParameters(); 
     //this.loadResults(); 

    } 
    } 





    }); 

Answer 1

我想你「這個」指向window對象。嘗試

that = this;//In initialize 

和checkScroll使用that代替this。

Answer 2

正是因爲這一點：

document.addEventListener("scroll", this.checkScroll, this); 

的DOM addEventListener功能的確需要三個參數，但第三個是不是一個上下文參數，它是一個布爾告訴它是否處理捕獲階段事件事件傳播。相反，你可以綁定與正確的上下文事件處理程序：

document.addEventListener("scroll", this.checkScroll.bind(this));