Input type="image" + jquery image click function + Enter

I have this,

<script type="text/javascript">
...
开发者_开发百科$("#img-clck").click(codeAddress);
...
</script>

<input type="image" src="btn.png" alt="" id="img-clck" />
<input type="text" name="Addr" id="Addr" value="" onclick ="document.getElementById('Addr').value='';"/>

While I can perform the function call by clicking on the image button, the problem is that I need the pressing "Enter" too. I have tried to include the <form> before the <input ...> but that lead me to GET.

How to I do to get the pressing "Enter"??

Thanks in advance.

You have to find the keypress event happening in window.

Something like this:

$(window).keypress(function(e) {
    if(e.keyCode == 13) {
        // this is an Enter!
        $("#img-clck").trigger("click");
        return false;
    }
});

Good luck.

Just wrap it in a form and use the onsubmit event of the form -- that way it will work both on Enter and on click:

$('#myform').submit(function() {
  codeAddress();
  return false;
});

$(window).keyup(function(e) {
    if(e.keyCode == 13) {
        // this is an Enter!
        $("#img-clck").trigger("click");
        return false;
    }
});

you can also use keyup event. Keypress is for character keys. Enter is not character key.

You should put your inputs inside a form element.

<form id="form">
  <input type="image" src="btn.png" alt="" id="img-clck" />
  <input type="text" name="Addr" id="Addr" value="" onclick ="document.getElementById('Addr').value='';"/>
</form>

In your JavaScript:

$('#form').submit(function(e){
  e.preventDefault();
  //Process form
});

If you press enter inside the Addr field, or click on the image, it'll submit.

JSFiddle