2013-06-28 113 views
4

可以插入另一個視圖的簡單彈窗視圖。上創建它被引用到父視圖的視圖元素:Backbone.js切換彈出窗口

function(app) { 

    var Popover = app.module(); 

    Popover.Views.Default = Backbone.View.extend({ 
    className: 'popover', 
    initialize: function(options) { 

     this.reference = options.reference; 
     this.reference.bind('click', this.toggle()); 

     this.render(); 
    }, 
    beforeRender: function() { 
     this.content = this.$el.find('.popover'); 
    } 
    toggle: function() { 
     console.log('toggle'); 
    } 
    }); 

    // Required, return the module for AMD compliance. 
    return Popover; 
}); 

基準是在其上酥料餅的將被設置像元件:然而,當

Main.Views.Start = Backbone.View.extend({ 
    template: "main/start", 
    serialize: function() { 
     return { model: this.model }; 
    },   
    initialize: function() { 
     this.popover = new Popover.Views.Default({ 
      reference: this.$el.find('.member') 
     }); 
     this.listenTo(this.model, "change", this.render); 
    }, 
    beforeRender: function(){ 
     this.insertView(this.popover); 
    } 
    }); 

正確顯示的酥料餅,我點擊a.member沒有任何反應。除此之外,我注意到在頁面刷新時,切換方法被觸發並且切換出現在日誌中。很緊張。任何想法爲什麼發生這種情況如何將父視圖中的鏈接點擊與彈出窗口的切換方法連接起來?

當我登錄時的參考:

[prevObject: jQuery.fn.jQuery.init[1], context: undefined, selector: ".member", jquery: "2.0.0", constructor: function…]context: undefinedlength: 0prevObject: jQuery.fn.jQuery.init[1]selector: ".member"__proto__: Object[0] 

回答

1

你是不是正確的事件綁定到reference,嘗試用:

this.reference.bind('click', this.toggle); 

目前正在創建的popover對象$el不包含.member元素,您的日誌顯示長度等於0的對象。確保您是創建popover後創建member,也許在render方法之後。

+0

嗯它不綁定,當我點擊元素什麼也沒有發生 –

+0

@artworkadシ你從控制檯得到東西嗎? –

+0

這只是一個錯字,我在我的問題中發佈了參考日誌 –