骨幹JS動態事件與變量

可以說，我得到了這樣的觀點：。骨幹JS動態事件與變量

var HomeView = Backbone.View.extend({ 
    el: '#application', 
    initialize: function() { 
     this.template = template; // Comes from requireJS (not relevant) 
     this.$elements = {}; 
    }, 
    render: function() { 
     this.$el.html(this.template); 

     this.$elements = { 
      signIn: { 
       email: $('#sign-in-email'), 
       password: $('#sign-in-password') 
      } 
     }; 

     // Demonstration. 
     this.$elements.signIn.email.myPluginInit(); 
     this.$elements.signIn.password.myPluginInit(); 

     // 
     // NOTE: How to handle the events? 
     // 
    } 
});

我有這個$元素對象，其中將包含我的DOM存在的所有對象，我怎樣才能把事件對他們因爲採用這種解決方案它們是可變的這是我以前做的事（參見backbone.org）。

var HomeView = Backbone.View.extend({ 
    events: { 
    'click #sign-in-email': 'clickedSignInEmail', 
    'focus #sign-in-password': 'focusSignInPassword' 
    } 
});

來源

2012-12-07 onlineracoon

聽起來像是你應該有不同的視圖結構，你會使用不同的子視圖取決於什麼部件，你需要在頁面上。然後，您的登錄事件將綁定到一個子視圖，並且您不會有可變事件。 –

如何使用jQuery的正常事件處理的語法？

this.$elements.signIn.email.click(this.clickedSignInEmail); 
this.$elements.signIn.password.focus(this.focusSignInPassword);

您還可以使用Backbone.View.delegateEvents方法，但是這需要你從你選擇構建事件哈希值。

來源

2012-12-07 11:33:33 jevakallio

它的工作原理，但這將成爲很多代碼，因爲this.clickedSignInEmail不工作，將取代「clickedSignInEmail」函數中的「this」值，所以我必須做「this。$ elements.signInEmail.click （function（）{self.clickedSignIn;}）「 – onlineracoon

你可以在'initialize'中強制綁定上下文：'_.bindAll（this）;' – jevakallio

使用delegateEvents提供手動使用jQuery綁定期間呈現事件的子元素在若干優點。所有附加的回調被綁定到視圖之前被切換到 jQuery，所以當調用回調時，這繼續引用的視圖對象。當delegateEvents再次運行時，可能使用不同的事件散列，所有回調將被刪除並重新授權 - 對於需要在不同的模式下行爲不同的視圖很有用。

示例代碼：

initialiaze: function() { 
    // … 
    this.events = this.events || {}; 
    // dynamically build event key 
    var eventKey = 'click ' + '#sign-in-email'; 
    this.events[eventKey] = 'clickedSignInEmail'; 
    this.delegateEvents(); 
    // … 
}

來源

2012-12-07 11:40:54

更好的克隆事件，然後在initialize ）：'this.events = _.clone（this.events）| {}'。否則，如果你定義了它，你會改變全局事件對象。這不是很酷，並且有時會導致錯誤的附加事件觸發。 – HighCat

但是'this.events'將特定於視圖實例，然後它就是你想要做的 - 你不希望每個對象都有自己的'events'屬性，你想要改變原型。 –

好的。在我個人的情況下，我確實需要爲每個視圖實例提供自己的「事件」。但是從'initialize'內部改變原型並不奇怪嗎？ – HighCat

骨幹JS動態事件與變量

回答

相關問題