Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery - Trigger click event on links with spacebar?

It looks like in most browsers, an <input type="submit"> treats both [spacebar] and [enter] as a click, but an <a> link only treats [enter] as a click.

My app uses a number of links formatted to simulate buttons, so a user that is accustomed to tabbing to a button and pressing [spacebar] will be frustrated.

This bit of jQuery solves the problem:

$("a.Button").die("keypress").live("keypress", function(e) {
    if (e.which == 32) {
        $(this).trigger("click");
        e.preventDefault();
    }
});

My question: Is there a reason not to do this? I'm a little reluctant to override the browser's default behavior on something as basic as this, but since I'm already abusing the link tag to make it look like a button, at least this way I'm not violating the user's expectations any further.

like image 348
Herb Caudill Avatar asked Mar 12 '10 16:03

Herb Caudill


1 Answers

I think the most important standard to maintain is not the browser's behaviour, but rather the user's expected response.

If you have overriden the display of links by turning them into buttons, the user must be able to treat those "buttons" exactly as they would if it were a real button, otherwise you will confuse and irritate users who have spent years with this "learnt" behaviour.

like image 113
Andy Avatar answered Sep 25 '22 02:09

Andy