Backbone.JS on() Event

The Backbone.JS event on() method binds an event to an object and executes the callback when an event is fired.

Syntax:

object.on(event, callback, context)    

Parameters:
event: This parameter is used to specify the event whose binding with an object is needed.
callback: This parameter is used to specify the callback function that will be executed when an event is fired.
context: This is an optional parameter which is used to specify an object to be used to pass to a callback function.

Example:

<!DOCTYPE html> 
<html>
<head>  
<title>Example</title>  
<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" 
type="text/javascript"></script>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" 
type="text/javascript"></script>  
</head>  
<body>  
<script type="text/javascript">   
var X = _.extend({msg:'Hello World'}, Backbone.Events);  
X.on('func', function () {  
document.write("Triggered message: ");  
document.write(this.msg);  
});  
X.trigger('func');  
</script>  
</body>  
</html>

Output:

Triggered message: Hello World

Explanation:
The on() method will bind the event to an object. The function will then be executed when triggered and thus the message will be displayed.

Please Share