aspx.net retrieve click buttons

Question

this is my code:

<script type="text/javascript" language="javascript">
    $(document).ready(function() {
        // esc -------------------------------------------
        $(document).bind('keyup', 'esc', function(event) { seaClick('OboutImageButton1'); });
        $('#txbLct').bind('keyup', 'esc', function(event) { seaClick('OboutImageButton1'); });
        $('#txbQty').bind('keyup', 'esc', function(event) { seaClick('OboutImageButton1'); });
        $('#btnOk').bind('keyup', 'esc', function(event) { seaClick('OboutImageButton1'); });
        $('#OboutImageButton1').bind('keyup', 'esc', function(event) { seaClick('OboutImageButton1'); });
        // down ------------------------------------------
        $(document).bind('keyup', 'down', function(event) { myClick('btnNext'); });
        $('#txbLct').bind('keyup', 'down', function(event) { myClick('btnNext'); });
        $('#txbQty').bind('keyup', 'down', function(event) { myClick('btnNext'); });
        $('#btnOk').bind('keyup', 'down', function(event) { myClick('btnNext'); });
        //$('#OboutImageButton1').bind('keyup', 'down', function(event) { myClick('btnNext'); });
        // up --------------------------------------------
        $(document).bind('keyup', 'up', function(event) { myClick('btnPrev'); });
        $('#txbLct').bind('keyup', 'up', function(event) { myClick('btnPrev'); });
        $('#txbQty').bind('keyup', 'up', function(event) { myClick('btnPrev'); });
        $('#btnOk').bind('keyup', 'up', function(event) { myClick('btnPrev'); });
        //$('#OboutImageButton1').bind('keyup', 'up', function(event) { myClick('btnPrev'); });
        // return ----------------------------------------
        $(document).bind('keyup', 'return', function(event) { myClick('btnOk'); });
        $('#txbLct').bind('keyup', 'return', function(event) { myClick('btnOk'); });
        $('#txbQty').bind('keyup', 'return', function(event) { myClick('btnOk'); });
        $('#btnOk').bind('keyup', 'return', function(event) { myClick('btnOk'); });
        //$('#OboutImageButton1').bind('keyup', 'return', function(event) { myClick('btnOk'); });
    });
    function myClick(buttonName) {
        //alert(buttonName);
        //Get the button the user wants to have clicked
        var btn = document.getElementById(buttonName);
        if (btn != null) { //If we find the button click it
            //alert('clicked');
            btn.click();
            event.keyCode = 0
        } else {
            alert('error');
        }
        //alert('end');
    }
</script> 

where I use the code on myClick to call the function associated to the button click to do some things, basically it works, but if I try to use the button/keys like Enter or Esc, sometimes the page call some other button (and doesn't pass on the function myClick).

Any ideas why?

Answer 1

Most likely the enter pressed event is occurring on the first input element in your DOM. One suggestion would be to listen on the document for the keydown event and if the key pressed was the enter key then call your desired method.

$(document).keypress(function(e){
    var code = e.keyCode ? e.keyCode : e.which;
    if(code == '13') //call desired method
});