2011-10-18 37 views
5

Ai đó có thể cho tôi biết lý do không hoạt động sau đây. Tôi đang chờ đợi cảnh báo để bắn khi tôi nhấp vào liên kếtbackbone.js sự kiện xem đơn giản không kích hoạt

<body> 
    <a class="newnote" href="#">Add new note</a> 
</body> 

<script> 
var note = Backbone.Model.extend({}); 

var notes = Backbone.Collection.extend({ 
    model: note, 
    url: '<?= $this->createUrl('/filenotes/api'); ?>' 
}); 

var note_view = Backbone.View.extend({ 
    el: 'table', 

}); 

var Appview = Backbone.View.extend({ 
    el: $('body'), 

    events: { 
     "a click" : "showForm" 
    }, 
    initialize: function(){ 
     //alert('hi'); 
    }, 
    showForm: function(){ 
     alert('hi'); 
    } 
}); 

var v = new Appview(); 
</script> 

Có một jsfiddle đây http://jsfiddle.net/neilcharlton/yj5Pz/1/

Trả lời

19

selector $("body") của bạn đang kích hoạt trước khi DOM của bạn được tải, vì vậy nó sẽ trở lại trống và không bao giờ liên kết với liên kết.

Định nghĩa đối tượng đường trục được xác định bằng các ký hiệu đối tượng, có nghĩa là chúng được đánh giá ngay lập tức theo định nghĩa, không phải khi bạn khởi tạo mô hình.

này:

Backbone.View.extend({foo: "bar"}) 

là chức năng tương tự như thế này:

var config = {foo: "bar"}; 
Backbone.View.extend(config); 

Vì bạn có một selector $("body") làm giá trị cho el, nó được đánh giá là ngay sau khi Xem cấu hình được phân tích cú pháp , có nghĩa là DOM chưa được tải và không có gì sẽ được trả lại.

Có một số tùy chọn để giải quyết điều này ... tất cả đều liên quan đến việc trì hoãn việc đánh giá bộ chọn cho đến sau khi DOM được tải.

yêu thích cá nhân của tôi là phải vượt qua bộ chọn vào xem tại instantiation, sau khi DOM đã nạp:

var AppView = Backbone.View.extend({ 
    // don't specify el here 
}); 

$(function(){ 
    // after the DOM has loaded, select it and send it to the view 
    new AppView({ el: $("body") }); 
} 

Ngoài ra - như Skylar nói, sự kiện của bạn đã được tuyên bố là sai.

Dưới đây là một JSFiddle làm việc: http://jsfiddle.net/yj5Pz/5/

+0

Cảm ơn bạn đã cung cấp thêm thông tin. – 32423hjh32423

+1

Thậm chí tốt hơn nên dựa vào thực tế là Backbone sẽ tự động bọc 'el' của bạn với jQuery khi đã đến lúc: '{el:' body ', ...}', bây giờ 'this. $ El' sẽ là Phần tử jQuery bạn đang tìm kiếm. – rfunduk

+0

+1 rfunduk - chuỗi xương sống v0.9 mới giúp dễ xử lý hơn. không cần phải tự gói el của bạn trong một bộ chọn jquery bây giờ, vì xương sống hiện nó cho chúng ta –

9

Đối với người mới bắt đầu, những sự kiện đối tượng là các cú pháp sau:

events: { 
    "click a" : "showForm" 
}, 
1

Bên cạnh câu trả lời Derick của, chăm sóc về phạm vi của phần tử DOM, tôi đã cố gắng tạo ra hiện tượng nhấp chuột đơn giản trên một yếu tố nhưng View.el tôi đã tham khảo một cha hoặc mẹ không trực tiếp , sau đó nó cho một số lý do (có thể là một lỗi đệ quy) đã không được làm việc. Khi tôi thay đổi el để "cơ thể" chọn css tất cả mọi thứ đã đi tốt.

Các vấn đề liên quan