2011-10-10 39 views
7

Tôi có chế độ xem.Cách nhận phần tử kích hoạt sự kiện qua trình xử lý sự kiện đường trục

//define View 
var CreatePollView = Backbone.View.extend({ 
    events: { 
     "click #addOption": "addOption", 
     "change .dynamicInput": "changeInputs" 
    }, 
    initialize: function() { 
     _.bindAll(this, "render", "addOption", "changeInputs"); 
     this.model.bind('change', this.render); 
    }, 
    changeInputs: function() { 
     var newVal = $(this).val(); // this throws exception in jquery script 
     this.model.set("Subject", { Subject: newVal }); 
    }, .... 

Làm cách nào để truy cập phần tử (phần tử đầu vào) mà sự kiện thay đổi được kích hoạt?

Trả lời

8

Bạn đang nhận được một ngoại lệ bởi vì bạn đang gọi _.bindAll trên changeInputs. Khi bạn làm điều đó, bạn đang nói rằng changeInputs sẽ bị ràng buộc vào bối cảnh đối tượng của bạn bất cứ khi nào nó được gọi.

Nói cách khác, khi bạn tham khảo $(this), bạn đang gửi một phiên bản CreatePollView vào jQuery mà nó không thích.

Bạn muốn giữ nguyên ràng buộc này, vì bạn đang truy cập vào kiểu máy (this.model) để this cần phải là phiên bản CreatePollView.

Thay vào đó, bạn có thể nhận được một sự kiện từ chức năng của bạn và sử dụng target hoặc một số phần thông tin khác:

changeInputs: function(e) { } 
+0

+1 để giải thích thêm về _.bindAll thực sự thú vị tôi đôi khi vẫn phải vật lộn với những với phím tắt :) – Sander

+2

bên trong phương thức 'changeInputs' của bạn, bạn có thể lấy phần tử cụ thể đã được thay đổi bằng cách gọi' $ (e.currentTarget) 'hoặc' $ (e.target) 'như Brian được đề xuất, tùy thuộc vào nhu cầu của bạn. 'e' là một đối tượng jquery args, vì vậy hãy đọc tài liệu của jquery để hiểu sự khác biệt. –

+0

cảm ơn các bạn @Sander. Lời giải thích hay. Nó có vẻ giống như một cách thích hợp để làm điều đó. Trong khi đó tôi quản lý để làm cho nó hoạt động, nhưng tôi không thực sự hiểu bộ sưu tập đối số đến từ đâu ... xem mã bên dưới changeInputs: function() { var newVal = arguments [0] .srcElement. giá trị; this.model.set ("Chủ đề", {Chủ đề: newVal}); }, – Tom

0
changeInputs: function(e){ 
    //use e.target 
    ... 
} 
Các vấn đề liên quan