Contoh program Hello World bagi Backbone.js_Others

header('Content-Type: application/json; charset=utf-8');
die(json_encode(array('name'=>'tom')));

// Ini ialah kelas global yang mengurus pandangan/kawalan/model
var Apl = {
Model: {},
Pandangan: {},
Pengawal: {},
Koleksi: {},
mulakan: function() {
App.Controllers.Routes();
baharu Backbone.history.start() // Untuk memacu semua program Backbone, Backbone.history.start() adalah perlu.
}
};
App.Models.Hello = Backbone.Model.extend({
url: function() {
            return '/api.php'; // Dapatkan alamat hujung belakang data.
},
mulakan: function() {
This.set({'message':'hello world'}); // Hujung hadapan mentakrifkan medan mesej, dan medan nama disediakan oleh hujung belakang.
}
});
App.Views.Hello = Backbone.View.extend({
el: $("badan"),
templat: $("#hello-container-template").html(),
mulakan: fungsi(pilihan){
this.options = pilihan;
this.bind('change', this.render);
this.model = this.options.model;
},
render: function(){ // Kaedah render hanya mempunyai dua matlamat: mengisi this.el dan mengembalikan ini untuk operasi rantai.
$(this.el).html(Mustache.to_html($(this.el).template,this.model.toJSON()) );
pulangkan ini
}
});
App.Controllers.Routes = Tulang Belakang.Controller.extend({
laluan: {
"!/hello" : "hello",//Gunakan #!/hello untuk memandu penghalaan
},
helo : function() {
//Buat model baharu Selepas model berjaya meminta kandungan yang dikemas kini dari bahagian belakang, ia akan memaparkan halaman baharu berdasarkan model
var helloModel = App.Models.Hello;
helloModel.fetch({
kejayaan: fungsi(model){
var helloView = App.Views.Hello baharu({model: model});
helloView.trigger('change');
}
})
}});
App.initialize();