SSilicon
SSilicon

Reputation: 253

How to set 'enter' to hotkey of a link in my webpage?

I have a link that function as the submit button of the search bar:

<a href="#" id="search"><img src="images/go.png" /></a>

Is there anyway I can set enter as the hotkey for that link?

For example, when user press enter it will automatically fire the link and start searching, just like google.

This is what I got so far, but seems like it doesn't work:

    addEventListener("keypress", function (event) {
        if (event.keyCode == 13)
            $('search').trigger('click');
    });

Upvotes: 0

Views: 90

Answers (2)

Jefferson Ribeiro
Jefferson Ribeiro

Reputation: 135

Wrappe your search bar component in a form tag. It will automatically set the enter key as the default hotkey to fire a search event.

Exemple:

<form action="someServerSideFileToHandleTheSearchInput">
    <input type="text"><!-- I think you have a input form here? -->
    <a href="#" id="search"><img src="images/go.png" /></a>
</form>

That's good because it will keep working even if people disable javascript in their browsers.

Upvotes: 1

workabyte
workabyte

Reputation: 3775

stealing this snip from here, full credit to @TheSuperTramp for his original answer

if you are only trying to submit the form when enter is pressed in the search box and not the entire document then this should get you in the right direction

$('#textarea').bind("enterKey",function(e){
    //submit your search here
});
$('#textarea').keyup(function(e){
    if(e.keyCode == 13)
    {
      $(this).trigger("enterKey");
    }
});

Upvotes: 0

Related Questions