Question

Example:

$(X).bind('click', function() { alert( 'Two' ); });
$(X).bind('click', function() { alert( 'Three' ); });
$(X).bind('click', function() { alert( 'Four' ); });
$(X).bind('click', function() { alert( 'Five' ); });

**$(X).bindUp('click', function() { alert( 'One' ); });**

When the user click X the output should be:

alert( 'One' );
alert( 'Two' );
alert( 'Three' );
alert( 'Four' );
alert( 'Five' );

It’s possible??

Thanks………………….

Answer 1

For simple cases, I think you could do something like this:

Example: http://jsfiddle.net/uEEzt/2/

$.fn.bindUp = function(type, fn) {

    this.each(function() {
        $(this).bind(type, fn);

        var evt = $.data(this, 'events')[type];
        evt.splice(0, 0, evt.pop());
    });
};

When you use this .bindUp() plugin, it just does a normal .bind(), but then removes the event from the end, and places it at the beginning.

Again, this would be for simple cases only.

---

EDIT: It should be simple to make this work with multiple events, but don’t try to use it with hover.

---

EDIT: Here’s a version that works with multiple (space separated) events (again, don’t use with hover):

Example: http://jsfiddle.net/uEEzt/4/

$.fn.bindUp = function(type, fn) {

    type = type.split(/\s+/);

    this.each(function() {
        var len = type.length;
        while( len-- ) {
            $(this).bind(type[len], fn);

            var evt = $.data(this, 'events')[type[len]];
            evt.splice(0, 0, evt.pop());
        }
    });
};

EDIT: Fixed mistake in “multiple” version where len variable was not reset.