Navigate table with arrow keys using jQuery

gistfile1.js

$('table.arrow-nav').keydown(function(e){
    var $table = $(this);
    var $active = $('input:focus,select:focus',$table);
    var $next = null;
    var focusableQuery = 'input:visible,select:visible,textarea:visible';
    var position = parseInt( $active.closest('td').index()) + 1;
    console.log('position :',position);
    switch(e.keyCode){
        case 37: // <Left>
            $next = $active.parent('td').prev().find(focusableQuery);   
            break;
        case 38: // <Up>                    
            $next = $active
                .closest('tr')
                .prev()                
                .find('td:nth-child(' + position + ')')
                .find(focusableQuery)
            ;
            
            break;
        case 39: // <Right>
            $next = $active.closest('td').next().find(focusableQuery);            
            break;
        case 40: // <Down>
            $next = $active
                .closest('tr')
                .next()                
                .find('td:nth-child(' + position + ')')
                .find(focusableQuery)
            ;
            break;
    }       
    if($next && $next.length)
    {        
        $next.focus();
    }
});

i need solution in javascript .plz help

i need solution in javascript .plz help

The fallowing link may help you.
https://stackoverflow.com/questions/4609405/set-focus-after-last-character-in-text-box

Hi!, first of all thanks for this solution,
I was trying to skip readonly inputs by adding input:not([readonly] in focusableQuery but it is not working
is there a way to skip readonly inputs?

thanks

It's worked ....
thks thks so much !!!!!!

Thank you so much.
It is working fine

thanks