上點擊

Question

寫像jQuery的回調在jQuery中您可以使用調這樣的：

$('#btn').on('click', function() { 
// code 
}); 

我怎麼能寫的東西就像即

foo.on('bar', function() { 
    // code 
}); 

foo.on('buzz', function() { 
    //code 
}); 

？

謝謝。

Answer 1

就像是：

var eventBus = function() { 

    var supportedEvents = ['bar', 'buzz']; 

    var subscribers = {}; 
    for (var i = 0; i < supportedEvents.length; i++) { 
     subscribers[supportedEvents[i]] = []; 
    } 

    return { 
     on: function (event, action) { 
      subscribers[event].push(action); 
     }, 

     trigger: function (event) { 
      var funsToCall = subscribers[event] || []; // empty array if unsupported event 
      for (var i = 0; i < funsToCall.length; i++) { 
       funsToCall[i](); // calling a function 
      } 
     } 
    } 
} 

然後調用eventBus函數來得到一個對象，這將是你的foo：

var foo = eventBus(); 

foo.on('bar', function() { 
    console.log('bar'); 
}); 

foo.on('buzz', function() { 
    console.log('buzz'); 
}); 

foo.trigger('bar'); // prints 'bar' to the console 
foo.trigger('buzz'); // prints 'buzz' to the console 

Answer 2

這是jQuery的一個有效的聲明，來調用需要觸發使用.trigger(eventname)

像

foo.trigger('foo') 

Answer 3

下面的文章將有助於事件的方法

如何在jQuery中創建自定義事件

http://www.sitepoint.com/jquery-custom-events/

jQuery的.trigger方法是關鍵。您可以在任何時候觸發具有新類型名稱和任意數據的事件，例如

$.event.trigger({ 
    type: "newMessage", 
    message: "Hello World!", 
    time: new Date() 
}); 

處理程序現在可以訂閱「newMessage」事件，例如，

$(document).on("newMessage", newMessageHandler);