Enter key triggering link

Focus + enter will trigger the click event, but only if the anchor has an href attribute (at least in some browsers, like latest Firefox). Works:

$('<a />').attr('href', '#anythingWillDo').on('click', function () { alert('Has href so can be triggered via keyboard.'); // suppress hash update if desired return false; }).text('Works').appendTo('body'); 

Doesn't work (browser probably thinks there's no action to take):

$('<a />').on('click', function () { alert('No href so can\'t be triggered via keyboard.'); }).text('Doesn\'t work').appendTo('body'); 

You can trigger() the click event of whichever element you want when the enter key is pressed. Example:

$(document).keypress(function(e) { if ((e.keyCode || e.which) == 13) { // Enter key pressed $('a').trigger('click'); } }); $('a').click(function(e) { e.preventDefault(); // Link clicked }); 

Demo: http://jsfiddle.net/eHXwz/1/

You'll just have to figure out which specific element to trigger the click on, but that depends on how/what you are doing. I will say that I don't really recommend this, but I will give you the benefit of the doubt.

A better option, in my opinion, would be to focus() the link that should be clicked instead, and let the user optionally press enter, which will fire the click event anyways.

I would like to focus on the link, but am unfamiliar exactly how to do this, can you explain?

Just use $(element).focus(). But once again, you'll have to be more specific, and have a way to determine which element should receive focus, and when. Of course the user, may take an action that will cause the link to lose focus, like clicking somewhere else. I have no idea what your app does or acts like though, so just do what you think is best, but remember that users already expect a certain kind of behavior from their browsers and will likely not realize they need to press "enter" unless you tell them to.

If you do choose to use the "press enter" method instead of focusing the link, you'll likely want to bind() and unbind() the keypress function too, so it doesn't get called when you don't need it.

• http://api.jquery.com/focus/
• http://api.jquery.com/bind/
• http://api.jquery.com/unbind/

Related:

• Submitting a form on 'Enter' with jQuery?
• jQuery Event Keypress: Which key was pressed?

Use e.target or this keyword to determine which link triggered the event.

$('a.panel').click(function (e) { //e.target or this will give you the element which triggered this event. }; 

$('a.panel').live('keyup', function (evt) { var e = evt || event; var code = e.keyCode || e.which; if (code === 13) { // 13 is the js key code for Enter $(e.target).trigger('click'); } }); 

This will detect a key up event on any a.panel and if it was the enter key will then trigger the click event for the panel element that was focused.