//调用: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++;
});
}

JS实现表格使用上下左右键聚集的更多相关文章

  1. 在tmux中的vi 上下左右键变为了ABCD等字符

    在本机上用vim编辑时,上下左右键没有问题,但是在tmux中确出现ABCD等字符. 原因是在tmux这个终端,默认做了字符转换,网上搜了很多答案,解决问题的设置是: set term=xterm

  2. java 事件处理机制:按下上下左右键控制小球的运动

    /** * 加深对事件处理机制的理解 * 通过上下左右键来控制一个小球的位置 */package com.test3;import java.awt.*;import javax.swing.*;im ...

  3. ubuntu vi上下左右键无法使用?

    使用vm安装ubuntu出现vi上下左右键无法正常使用. 执行以下两句就可以了 $sudo apt-get remove vim-common    $sudo apt-get install vim

  4. ArcEngine中使用上下左右键移动地图

    转自愿文ArcEngine中使用上下左右键移动地图 因项目需要,需对mapcontrol控件响应上下左右键,从网上找的方法都一样,都值提到了需要设置axMapControl1的KeyIntercept ...

  5. JS中表格的全选和删除要注意的问题

    在项目开发中,由于刚刚开始做项目,我对js还不是很精通,所以在用js对表格的全选和删除中遇到了不少问题,后来通过查找资料解决了,之后总结了一下关于js表格的全选和删除出现的一些问题,希望能帮助到大家. ...

  6. datagrid-detailview.js easyui表格嵌套

    datagrid-detailview.js easyui表格嵌套

  7. ubuntu中vim下按上下左右键时输入A、B、C、D的问题

    ubuntu下使用vi 进行编辑文件时,按上下左右键时,会输入A.B.C.D,这个用起来很不方便.网上查得此问题的原因是: ubuntu系统自带的 vi 不完整导致,解决方法:安装完整的vi $ su ...

  8. 案例学习总结:原生JS实现表格排序

    最近在学习js的表格排序,没想到看不起眼的表格排序实际上却暗含了众多JS知识点.在这里记录一下此次学习过程.希望对大家也有所帮助. 完整的表格排序涉及了下列这些知识点: call方法使用 sort方法 ...

  9. JS对表格排序(支持对序号,数字,字母,日期)

    JS对表格排序(支持对序号,数字,字母,日期) 前不久看到淘宝组件有"对表格排序的插件" 如想要看 可以看这个地址 http://gallery.kissyui.com/KSort ...

随机推荐

  1. 哪些 Python 库让你相见恨晚?【转】

    原文链接:https://www.zhihu.com/question/24590883/answer/92420471 原文链接:Python 资源大全 ---------------- 这又是一个 ...

  2. MATLAB 条形图添加多个图例

    MATLAB 条形图添加多个图例: 1)只有一个图例: 2)两个图例:

  3. 安装APK失败,错误代码:INSTALL_FAILED_INVALID_APK 解决方案

    错误代码:installation failed with message failed to finalize session:INSTALL_FAILED_INVALID_APK 解决方法如下:

  4. Python(可变/不可变类型,list,tuple,dict,set)

    补充:(可用操作技巧) >>> x=900 >>> y=900 >>> x==y True >>> type(x) is typ ...

  5. LaTeX网址

    https://www.latex-project.org/   latex官网 http://www.latexstudio.net/   国内知名latex学习中心 https://www.ove ...

  6. 训练的时候 nvidia:自动刷新

    间隔一秒自动刷新: watch -n 1 -d nvidia-smi

  7. 10款基于jquery的web前端动画特效

    1.jQuery横向手风琴图片切换动画 之前我们为大家分享过很多款基于jQuery和CSS3的手风琴菜单和手风琴焦点图插件,比如CSS3响应式垂直手风琴菜单和jQuery横向手风琴图片展示插件.今天要 ...

  8. js正则匹配html标签中的style样式和img标签

    <!DOCTYPE html> <html> <head> <title></title> </head> <body&g ...

  9. hdoj:2051

    #include <iostream> #include <string> #include <vector> #include <algorithm> ...

  10. 【nodejs】初识 NodeJS(三)

    上节我们将 http 服务器(server.js)和请求路由模块(route.js)整合在一起了,当然这还不够,路由,顾名思义,是指我们要针对不同的 url 有不同的处理方式. 请求处理程序模块(re ...