Question

I have a mousedown event attached in an anchor element which does many stuffs.

I also have a mousedown event attached to the document, and because of bubbling this event is called whenever the event attached to anchor is triggered. This is not what I want.

Can I bind a event with delay?
I dont want to use stopPropagation.

$('a').mousedown ->
  ...
  openWindow()
  $(document).mousedown ->
     ...
     closeWindow()

Edit

I create a hack

$.fn.onBubble = (events, selector, data, handler) ->
    setTimeout => 
        this.on events, selector, data, handler 
    , 0

Work but like very ugly

Answer 1

As one of the comments mentions, the only way to stop events from bubbling is with stopPropagation. That said, if there are both conditions where you do want to prevent bubbling and others where you do not, you can put event.stopPropagation() into an if-statement:

$(...).mousedown(function(event) {
    if(/* some condition */) { event.stopPropagation(); }
});

Alternatively you can add a conditional to the event handler attached to the document. For example:

$(document).mousedown(function(event) {
    if($(event.target).is("a")) {
        return; // if the element that originally trigged this event
                // (i.e. the target) is an anchor, then immediately return.
    }
    /** code that runs if event not from an anchor **/
});

This snippet uses $.fn.is to determine if the event was triggered by an anchor. If it is generated by an anchor, the code immediately returns, which in effect ignores the event bubble.

EDIT in response to comment:

If I understand correctly, you want to close the window, if the user clicks on anything that is not in the window. In that case try this:

function whenWindowOpens { // Called when the window is opened
    var windowElement; // Holds actual window element (not jQuery object)
    $(document).bind("mousedown", function(event) {
        if($.contains(windowElement, event.target)) {
            return; // Ignore mouse downs in window element
        }

        if($(event.target).is(windowElement)) {
            return; // Ignore mouse downs on window element
        }

        /** close window **/

        $(this).unbind(event); // detaches event handler from document
    });
}

This is basically a variation on the second solution suggested above. The first two if-statements ensure the mouse down did not occur in (using $.contains) or on (using $.fn.is again) the windowElement. When both statements are false, we close the window and unbind the current event handler. Note that $.contains only takes raw DOM elements — not jQuery objects. To get the raw DOM element from a jQuery object use $.fn.get.