Backbone.js Event 事件介紹

backbone
今天我們可以來介紹

Backbone.js Event 事件,介紹 Event 之前,大家可以先看看 Backbone.js 的初學介紹,該教學文件可以學習如何載入 Backbone.js library,利用此套件如何去制定各種事件。Backbone.js 提供了3個 method 去控制事件產生、移除、執行,分別是 on(bind)off(unbind)trigger。文字上寫得很清楚 on 就等於 bind,off 就是 unbind,最後就是如何去 trigger 事件。底下就來簡單舉例:

[Read More]

Javascript 前端工具 Backbone.js Framework 初學介紹

backbone
我相信大家對於後端程式

PHP, Ruby, Python .. 等語言都已經相當熟悉,進階開發者也都接觸了好用的後端 Framework 如 CodeIgniter, CakePHP, Django, Ruby on Rail, Yii, Symfony .. 等,用 Framework 最大的好處並不是在 Framework 提供了大量工具,而是制定了 MVC 架構,讓專案多位開發者可以遵循,上了講了這麼多後端 MVC Framework,那麼前端呢?接下來介紹前端強大工具: Backbone.js

什麼是 Backbone.js 簡單來說 Backbone.js 就是一套前端 Javascript Framework,它提供 MVC 架構,相信大家都玩過後端 MVC,那至於前端呢,好像比較少人提到,這就是介紹 Backbone.js 最主要的目的。Backbone.js 包含了 Model View Controller 來讓使者操作,Model 提供了key-value 結構,以及可以 binding 大量 event,開發者可以透過 RESTful JSON interface 來跟 Backbone.js 的 Model 及 Collection 搭配。如果想瞭解 Backbone.js 線上文件可以參考

GitHub 網站,如果想瞭解程式碼可以參考 source code 註解

[Read More]

jQuery stopPropagation 和 stopImmediatePropagation 比較

近期在幫公司導入 Backbone.js 技術,把後台全面改寫成 Javascript MVC 架構,技術包含 jQuery + Backbone.js + Underscore.js + Mustache Template,這些技術我想可以寫另外一篇 Backbone.js 初體驗,這邊就先不多說了,在 Backbone.js 的 View 架構裡,可以任意 bind events,程式碼如下: RT.View = Backbone.View.extend({ initialize: function() { if (this.model) { this.model.bind("change", this.render, this); } if (this.collection) { this.collection.bind("all", this.render, this); } }, events: { 'click .add': 'add', 'click .edit': 'edit', 'click .delete': 'delete_item', 'click .delete_all': 'delete_all' }, add: function(e) { }, )}; 上面程式碼可以看到,將 click 事件綁在不同 Class 上,但是問題來了,如果同時 new 兩個 RT. [Read More]