Question

var Modal = function (content, options) {
   this.options = options
   this.$element = $(content)
   .delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
                                          ^^^^^^^^^^^^^^^^^^^^
                                        What does this mean?
}

I am quite fresh. I haven’t seen this sort of syntax before. My guess is click event, on any attribute which contains a ‘dismiss’ and have value of ‘modal’???

Answer 1

I think, what you are seeing is Namespaced Events. This is used extensively when you have multiple event handlers for a same event. See example below,

DEMO

$('#test').on('click.a', function () {
    alert('A is clicked');
});

$('#test').on('click.b', function () {
    alert('B is clicked');
});

$('#unbindA').on('click', function () {
    $('#test').off('click.a');
});

In the above example it just demonstrates unbind but it can also be used for triggering a specific handler like $('#test').trigger('click.a').

All the above is not possible when you just bind ‘click’ to both the handlers.

jQuery docs on Namespaced Events