onkeypress on a <a> tag

Question

I'm trying get my <a> tag triggered when the user press on the "enter" key. (onkeypress).

my <a> tag:

<a href="javascript:search()" onkeypress="return runScript(event)">

this is my javascript :

 function runScript(e)
   {
        if (e.keyCode == 13) {
                alert("dssd");
        return false;

      }
   }

I dont know whats messed up ?

Answer 1

its work for me

 <a href="javascript:search();"  onkeypress="return runScript(event);">Open in new window using javascript</a>

javaScript

 window.runScript = function (e) {

       if (e.keyCode == 13) {
           alert('ss');
           return false;
       }
       else {

           return true;
       }
   }

   window.search = function () {
       alert('s');
   }

live demo : fiddle

Answer 2

Write your html as given below. Note the property tabindex which makes the a tag focusable in certain browsers.

<a id="link" href="http://google.com" onkeydown="runScript(event)" tabindex="1">I am a link</a>

If you need an autofocus on load, you can use the jQuery function focus as shown below.

$(document).ready(
    function(e){
        $("#link").focus();
    }
);

Then your function

function runScript(e){
    if(e.keyCode == 13){
       alert("pressed enter key");
    }
}

you have to call e.preventDefault(); (or return false in some browsers) if you want to prevent the link load the link in href.

function runScript(e){
    e.preventDefault();
    if(e.keyCode == 13){
       alert("pressed enter key");
    }
    return false;
}

see a demo here: http://jsfiddle.net/diode/hfJSn/9/show press enter key when the page is loaded

Answer 3

The ENTER key actually triggers the onclick event:

<a href="#" onclick="alert('hello!');">

This means that your search() function inside the href will execute before the onkeypress event.

Answer 4

That works in my browser, though I suspect it's not the way to achieve what you actually want to do... (maybe?)

Number one, you probably don't want it to "return" anything, so you can just do onkeypress="runScript(e)" and it'll run. If that function does return a value, it's not gonna go anywhere...

Number two, it's kinda rare that a keydown event would fire on an anchor (<a>) element, unless of course the user tabs through the other elements 'till it has focus and then presses a key (usually the browser will "highlight" the element that currently has keyboard focus, if it's not just the whole page). Are you wanting your script to run when someone presses enter after typing in a search box or something? if so, you probably want to listen for the event on the search box itself, so add it as that element's onkeydown attribute (for example: <input id="mySearchBox" onkeydown="runScript(e)">) if you just want it to run whenever the user presses enter, regardless of focus or typing text into any particular field, just do as edmastermind29's comment said and add the event listener to the whole document.

Answer 5

Have you tried adding this to your script?

document.onkeypress = runScript;