JS实现表格使用上下左右键聚集

//调用：new tabTableInput("tblGrid","text");
var tabTableInput = function (tableId, inputType) {
var rowInputs = [];
var trs = $("#" + tableId).find("tr");
var inputRowIndex = 0;
$.each(trs, function (i, obj) {
if ($(obj).find("th").length > 0) { //跳过表头
return true;
}
var rowArray = [];
var thisRowInputs;
if (!inputType) { //所有的input
thisRowInputs = $(obj).find("input:not(:disabled):not(:hidden):not([readonly])");
} else {
thisRowInputs = $(obj).find("input:not(:disabled):not(:hidden):not([readonly])[type=" + inputType + "]");
}
if (thisRowInputs.length == 0)
return true;

thisRowInputs.each(function (j) {
$(this).attr("_r_", inputRowIndex).attr("_c_", j);
rowArray.push({ "c": j, "input": this });

$(this).keydown(function (evt) {
var r = $(this).attr("_r_");
var c = $(this).attr("_c_");

if (evt.which < 37 || evt.which > 40) {
return;
}

var tRow
if (evt.which == 38) { //上
if (r == 0)
return;

r--; //向上一行

tRow = rowInputs[r];
if (c > tRow.length - 1) {
c = tRow.length - 1;
}
} else if (evt.which == 40) { //下
if (r == rowInputs.length - 1) { //已经是最后一行
return;
}

r++;
tRow = rowInputs[r];
if (c > tRow.length - 1) {
c = tRow.length - 1;
}
} else if (evt.which == 37) { //左
if (r == 0 && c == 0) {  //第一行第一个,则不执行操作
return;
}
if (c == 0) { //某行的第一个,则要跳到上一行的最后一个,此处保证了r大于0
r--;
tRow = rowInputs[r];
c = tRow.length - 1;
} else { //否则只需向左走一个
c--;
}
} else if (evt.which == 39) { //右
tRow = rowInputs[r];
if (r == rowInputs.length - 1 && c == tRow.length - 1) { //最后一个不执行操作
return;
}

if (c == tRow.length - 1) { //当前行的最后一个,跳入下一行的第一个
r++;
c = 0;
} else {
c++;
}
}

$(rowInputs[r].data[c].input).focus().select();
});
});

rowInputs.push({ "length": thisRowInputs.length, "rowindex": inputRowIndex, "data": rowArray });

inputRowIndex++;
});
}