Question

Suppose I have this jQuery code.

$(document).delegate('a[title]', 'click', function(event) {
       var txt = // href value of the link ;
       alert("txt");
})

How do I obtain the value of the href attribute of the link? I cannot use $(this) because that would refer to $(document).

Answer 1

better use .on() from jQuery (1.7+) since .delegate(), .bind() and .live() will be deprecated.

DEMO

//literally: bind to "document" a "click" handler for "a"
$(document).on('click', 'a', function(event) {
    var txt = this.href;  //or $(this).attr('href');
    alert(txt);
})

ideally, you would want to bind the handler to the nearest common parent of all the elements you want affected. binding it to document is a long distance call from element, which can incur serious performance penalties.

---

• jQuery deprecated .live() and advises to use .on()

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().

• jQuery superseded .delegate()

As of jQuery 1.7, .delegate() has been superseded by the .on() method. For earlier versions, however, it remains the most effective means to use event delegation.

• As of 1.7, jQuery prefers .on() over .bind() for flexible handling:

As of jQuery 1.7, the .on() method is the preferred method for attaching event handlers to a document. For earlier versions, the .bind() method is used for attaching an event handler directly to elements. Handlers are attached to the currently selected elements in the jQuery object, so those elements must exist at the point the call to .bind() occurs. For more flexible event binding, see the discussion of event delegation in .on() or .delegate().