A Backbone.js Playground

A simple playground for learning backbone.js without having to install or configure anything yourself.

by phoenecke

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://backbonejs.org/backbone.js"></script>
<div id='container'>
    <button id='btn'>Click me</button>
</div>

CSS

.on{
    color:red;
}

JavaScript

var someConfigSelector = '#btn';

var View = Backbone.View.extend({
    el: '#container',
    events: function() {
        // add some normal events to the hash
        var e = {
            'click #foo': 'doSomething1',
            'click #bar': 'doSomething2'
        };
        // add one where key is calculated
        e['click ' + someConfigSelector] = 'doSomething';
        // return events hash
        return e;
    },
    
    doSomething: function() {
        this.$('#btn').toggleClass('on');
    },
    
    doSomething1: function() {
    },
    
    doSomething2: function() {
    }
});

var view = new View();