Fix #11382. #11764. Only prevent click events on disabled elements.

We don't want a disabled link/button to register delegated clicks, but we do want events like mouseover or custom events.

This is a compromise, there is no perfect solution. Well, the browsers could be consistent about direct vs. delegated events but *that's* not gonna happen.

diff --git a/src/event.js b/src/event.js
index 8e17273f97a5964b1ccc3b2c84fbbc190b02c111..9a3f54d6702035b7bfc71f1abbcb624eb0226e9c 100644 (file)
--- a/src/event.js
+++ b/src/event.js
@@ -388,8 +388,8 @@ jQuery.event = {
 
                        for ( cur = event.target; cur != this; cur = cur.parentNode || this ) {
 
-                               // Don't process events on disabled elements (#6911, #8165)
-                               if ( cur.disabled !== true ) {
+                               // Don't process clicks (ONLY) on disabled elements (#6911, #8165, #xxxx)
+                               if ( cur.disabled !== true || event.type !== "click" ) {
                                        selMatch = {};
                                        matches = [];
                                        jqcur[0] = cur;

diff --git a/test/unit/event.js b/test/unit/event.js
index 07da83260531bb341de3bb5e66c6b34db826d390..479509ffb1acff884b4725ee64189e3aa880046c 100644 (file)
--- a/test/unit/event.js
+++ b/test/unit/event.js
@@ -1298,8 +1298,8 @@ test("Delegated events in SVG (#10791)", function() {
        svg.remove();
 });
 
-test("Delegated events in forms (#10844; #11145; #8165)", function() {
-       expect(3);
+test("Delegated events in forms (#10844; #11145; #8165; #xxxxx)", function() {
+       expect(5);
 
        // Alias names like "id" cause havoc
        var form = jQuery(
@@ -1334,11 +1334,20 @@ test("Delegated events in forms (#10844; #11145; #8165)", function() {
        form
                .append( '<button id="nestyDisabledBtn"><span>Zing</span></button>' )
                .on( "click", "#nestyDisabledBtn", function() {
-                       ok( true, "enabled/disabled button with nesty elements" );
+                       ok( true, "click on enabled/disabled button with nesty elements" );
+               })
+               .on( "mouseover", "#nestyDisabledBtn", function() {
+                       ok( true, "mouse on enabled/disabled button with nesty elements" );
                })
-               .find( "span" ).trigger( "click" ).end()        // yep
+               .find( "span" )
+                       .trigger( "click" )             // yep
+                       .trigger( "mouseover" ) // yep
+               .end()
                .find( "#nestyDisabledBtn" ).prop( "disabled", true ).end()
-               .find( "span" ).trigger( "click" ).end()        // nope
+               .find( "span" )
+                       .trigger( "click" )             // nope
+                       .trigger( "mouseover" ) // yep
+               .end()
                .off( "click" );
 
        form.remove();