$ .event.trigger không kích hoạt trong đối tượng không phải DOM

Question

var test = { } 
$(test).on("testEvent", function(){ 
    console.log("testEvent has fired"); 
}); 
$.event.trigger("testEvent"); 

Tôi đang cố gắng sử dụng jQuery để thực hiện cơ chế xuất bản/đăng ký sử dụng sự kiện. Tôi cần để có thể đính kèm các sự kiện vào các đối tượng không phải DOM và có thể kích hoạt tất cả các sự kiện từ một trình kích hoạt toàn cục. Tôi dự kiến ​​mã ở trên hoạt động nhưng không dẫn đến việc testEvent kích hoạt đối tượng thử nghiệm.

Lưu ý rằng sẽ có nhiều đối tượng trong đó một sự kiện sẽ được đăng ký. Một $ .event.trigger duy nhất sẽ kích hoạt tất cả các sự kiện đó.

Do lưu ý rằng mã này hoạt động tốt:

$('#someID').on("testEvent", function() { 
console.log('testEvent has fired from DOM element'); 
}) 
$.event.trigger("testEvent"); 

Answer 1

Sau khi thực hiện một số nghiên cứu nó xuất hiện như thể jQuery 1.7 cung cấp một cách dễ dàng để đưa ra một công bố/đăng ký cơ chế. (Tìm thấy here) Để có một xuất bản/đăng ký cơ chế mã sau đây có thể được sử dụng:

(function ($, window, undefined) { 
    var topics = {}; 

    jQuery.Topic = function (id) { 
     var callbacks, method, topic = id && topics[id]; 
     if (!topic) { 
      callbacks = jQuery.Callbacks(); 
      topic = { 
       publish: callbacks.fire, 
       subscribe: callbacks.add, 
       unsubscribe: callbacks.remove 
      }; 
      if (id) { 
       topics[id] = topic; 
      } 
     } 
     return topic; 
    }; 
}) 

Để đăng ký vào một sự kiện sau đây được thực hiện:

$.Topic("message").subscribe(function() { 
    console.log("a publish has occurred"); 
}); 

Để xuất bản một thông báo sau đây được thực hiện:

$.Topic("message").publish(data); 

"Tin nhắn" là tên sự kiện. Đối số dữ liệu chứa bất kỳ thông tin nào bạn muốn chuyển cho người đăng ký.

Để huỷ đăng ký bạn phải vượt qua các chức năng đã được đăng ký:

$.Topic("message").unsubscribe(funcSubscribedToBefore); 

Answer 2

Trong trình duyệt hiện đại (Nếu tôi đã read the source for Underscore.js bên phải) cho phép bạn liên kết các sự kiện để không đối tượng DOM natively. Nếu không, bạn sẽ phải sử dụng một cái gì đó như chức năng .bind gạch dưới. Vì vậy, nó phụ thuộc vào trình duyệt nào bạn cần hỗ trợ.

Edit:

Ok, nevermind, tôi đã suy nghĩ ràng buộc trong Underscore.js cũng giống như với Backbone. Xương sống có mô-đun sự kiện riêng của nó mà sự kiện ràng buộc, rõ ràng.

binding events to dynamic objects in underscore/backbone

Answer 3

Gần đây tôi đã sử dụng cách tiếp cận Bến Alman, và nó làm việc tuyệt vời!

/* jQuery Tiny Pub/Sub - v0.7 - 10/27/2011 
* http://benalman.com/ 
* Copyright (c) 2011 "Cowboy" Ben Alman; Licensed MIT, GPL */ 

(function ($) { 

    var o = $({}); 

    $.subscribe = function() { 
     o.on.apply(o, arguments); 
    }; 

    $.unsubscribe = function() { 
     o.off.apply(o, arguments); 
    }; 

    $.publish = function() { 
     o.trigger.apply(o, arguments); 
    }; 

}(jQuery)); 

Cách sử dụng:

$.subscribe('eventName', function (event) { 
    console.log(event.value); 
}); 

$.publish({ type: 'eventName', value: 'hello world' }); 

Xem https://gist.github.com/addyosmani/1321768 để biết thêm thông tin.