how to disable MobileSafari auto-selection?

Question

my webapp requires users to tap and hold on an element for a game action,
but iPhone automatically "selects" the area which is confusing to the user.

anyone know what html elements prevent selection, or if javascript can block selection?

any help is appreciated

Answer 1

Try handling the selectstart event and returning false .

Try applying the CSS rule, -webkit-user-select: none;

Answer 2

SLaks answer is obviously right - I just want to extend it a bit for future viewers. If you're using jQuery, here's a useful extension method that disables selection in various browsers:

$.fn.extend({ 
        disableSelection : function() { 
                this.each(function() { 
                        this.onselectstart = function() { return false; }; 
                        this.unselectable = "on"; 
                        $(this).css('-moz-user-select', 'none'); 
                        $(this).css('-webkit-user-select', 'none'); 
                }); 
        } 
});