Enter in input field focus nearest button in IE9

Question

I have a input field and a button in the code below.

I have write some javascript code to catch the keyup and show a alert if its the Enter key.

This work fine in Firefox, but in IE9 will a enter click in the input field resulted in that the button becomes focused and the keyUp trigger in javascript will not be fired.

Anyone have suggestions for solution?

jsfiddle: http://jsfiddle.net/c46khq2x/1/

HTML:

<input type="text" class="js-field-click"/>

<button class="js-button-click">Button</button>

javascript ( JQuery ):

 $( document ).ready(function() {


      $(".js-field-click" ).keyup(function(e) {
         var val = $(this).val();
         var code = e.which;

         if(code==13){
            alert("field enter");
         }
      });

     $(".js-button-click").click( function() {
            alert("button click");
     });
 });

Answer 1

I find a solution, it seems that IE9 select the next button within the form, so by wrapping text field in a form and leave the button outside of the form, then IE9 will not selecting the button and the script will work

<form>
    <input type="text" class="js-field-click"/>
</form>    

<button class="js-button-click">Button</button>