Permalink
Browse files

Conditionally add a live handler to kill clicks on .ui-disabled eleme…

…nts when CSS pointer-events property is not supported. Fixes #3558
  • Loading branch information...
gseguin committed Jun 20, 2012
1 parent b8f7494 commit 75fcd809b95f6d8627c64a15b694231ebf3895c3
Showing with 12 additions and 1 deletion.
  1. +12 −1 js/jquery.mobile.init.js
View
@@ -128,7 +128,18 @@ define( [ "jquery", "./jquery.mobile.core", "./jquery.mobile.support", "./jquery
// hide iOS browser chrome on load
$window.load( $.mobile.silentScroll );
- $( document ).delegate( ".ui-disabled", "vclick", function() { return false; });
+ if ( !$.support.cssPointerEvents ) {
+ // IE and Opera don't support CSS pointer-events: none that we use to disable link-based buttons
+ // by adding the 'ui-disabled' class to them. Using a JavaScript workaround for those browser.
+ // https://github.com/jquery/jquery-mobile/issues/3558
+
+ $( document ).delegate( ".ui-disabled", "vclick",
+ function( e ) {
+ e.preventDefault();
+ e.stopImmediatePropagation();
+ }
+ );
+ }
});
}( jQuery, this ));
//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);

3 comments on commit 75fcd80

@jaspermdegroot

This comment has been minimized.

Show comment Hide comment
@jaspermdegroot

jaspermdegroot Jun 24, 2012

Member

@gseguin @toddparker

Didn't think about this earlier, but buttons are not disabled when pressing "enter" on keyboard, regardless of pointer-events support.
I was thinking we could have "enter" trigger the "vclick" event in buttonMarkup and then change this to something like:

$( document ).delegate( ".ui-disabled", "vclick",
    function( e ) {
        if ( !$.support.cssPointerEvents || [enter keydown event] ) {
            e.preventDefault();
            e.stopImmediatePropagation();
        }
    }
);

What do you think?

Member

jaspermdegroot replied Jun 24, 2012

@gseguin @toddparker

Didn't think about this earlier, but buttons are not disabled when pressing "enter" on keyboard, regardless of pointer-events support.
I was thinking we could have "enter" trigger the "vclick" event in buttonMarkup and then change this to something like:

$( document ).delegate( ".ui-disabled", "vclick",
    function( e ) {
        if ( !$.support.cssPointerEvents || [enter keydown event] ) {
            e.preventDefault();
            e.stopImmediatePropagation();
        }
    }
);

What do you think?

@toddparker

This comment has been minimized.

Show comment Hide comment
@toddparker

toddparker Jun 25, 2012

Contributor

Good point. The second button on this page is disabled but can be focused then navigated via the Enter key:
http://jquerymobile.com/test/docs/buttons/buttons-types.html

Not sure of the best solution - guessing @gseguin or @johnbender may have some good ideas.

@ugomobi - Mind making a new issue for this? Guessing we'll tackle this in 1.3.

Contributor

toddparker replied Jun 25, 2012

Good point. The second button on this page is disabled but can be focused then navigated via the Enter key:
http://jquerymobile.com/test/docs/buttons/buttons-types.html

Not sure of the best solution - guessing @gseguin or @johnbender may have some good ideas.

@ugomobi - Mind making a new issue for this? Guessing we'll tackle this in 1.3.

@jaspermdegroot

This comment has been minimized.

Show comment Hide comment
@jaspermdegroot

jaspermdegroot Jun 25, 2012

Member

Issue ticket: #4602

Member

jaspermdegroot replied Jun 25, 2012

Issue ticket: #4602

Please sign in to comment.