JAVASCRIPT網頁應用程式設計

188

|

第十一章

這段範例程式裡，所有符合選取項查詢條件的表單輸入欄位，只要一接收到

keydown

事

件，就會呼叫控制器的

keydown

回叫函式。由於 Spine 會確保回叫函式在執行時用的執

行環境一定是正確的，所以不需要再用代理器函式處理事件的回叫函式。

回叫函式會接收到一組

event

物件，就前面這段程式而言，這個物件非常重要，因為可

以透過它取得使用者按下的按鍵是哪一個，也可以透過它的

target

屬性，取得觸發此

事件的網頁元件。

控制器事件

Spine 的控制器除了支援事件委派之外，也支援自訂事件。Spine 的控制器預設是由

Spine.Events

擴充而成的，這意味著 Spine 的控制器也繼承了所有事件的功能，像是

bind()

和

trigger()

。你可以利用這些功能來降低控制器彼此之間的耦合，也可以在控

制器內部使用它們：

var Sidebar = Spine.Controller.create({

events: {

"click [data-name]": this.click

},

init: function(){

this.bind("change", this.change);

},

change: function(name){ /* ... */ },

click: function(e){

this.trigger("change", $(e.target).attr("data-name"));

}

// ...

});

var sidebar = Sidebar.init({el: ...