CristalT
7/4/2016 - 7:45 PM

It allows navigate an HTML table by using keyboard arrows

It allows navigate an HTML table by using keyboard arrows

$.fn.arrownav = function(options) {
    var settings = $.extend({
        focusOnLoad: true
    }, options);
    var curRow = this.children('tr:first-child'),
        r=0;
    if(settings.focusOnLoad) {
        curRow.focus();
    }
    this.children('tr').click(function(){
        curRow = $(this);
    });
    this.keydown(function(e) {
        if(e.keyCode == 40) {
            e.preventDefault();
            r = curRow.next();
        }
        if(e.keyCode == 38) {
            e.preventDefault();
            r = curRow.prev();
        }
        if(r.length > 0) {
            curRow = r;
            curRow.focus();
        }
    })
};