.on() - delegated event handler using selector

[[email protected]…]

The plugin I created which uses a <dl> list works fine using this syntax of on():

$dockPanel.on("click","dt",function(e){ HandlePanel($(this)); });

But since my plugin element can be nested within itself, I only want to effect it's direct child level element of 'dt', not all descendant <dt> elements for the <dl>, so what I need is this:

$dockPanel.on("click",">dt",function(e){ HandlePanel($(this)); });

The above syntax does not work using a child selector though...

[dmethvin]

This isn't a bug since the selector is invalid; please ask for help on the forum.

[Krinkle]

I ran into this today as well: ​http://jsfiddle.net/pUh3F/

Contrary to the actual implementation, I think the expected behavior is that the delegate selector is interpreted relative to the element that the event handler is bound to.

So if you got a <ul> with potentially nested lists, and you want a delegate selector on the direct children of the list, one would use $('#my-list').on('click', '>li', function () { .. }); But that doesn't work because the selector is not checked including the appropriate context.

I'd like to ask if this can be turned into a feature request. To add support to the delegate selector in .on() for having the selector checked with the bound element as context.

[syndicatedshannon]

related: #11993

[Timmy Willison]

Update Sizzle: Minor edits and fixes #10762.

Changeset: a08a18b80adc403dc2914ee6b1ca8752aeddef30

[Richard Gibson]

Support event delegation with relative selectors. Fixes #10762. Closes gh-860.

Changeset: e761e0c6e0561093ff1e52d0cba6ace04daa8798