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++;
});
}
JS实现表格使用上下左右键聚集的更多相关文章
- 在tmux中的vi 上下左右键变为了ABCD等字符
在本机上用vim编辑时,上下左右键没有问题,但是在tmux中确出现ABCD等字符. 原因是在tmux这个终端,默认做了字符转换,网上搜了很多答案,解决问题的设置是: set term=xterm
- java 事件处理机制:按下上下左右键控制小球的运动
/** * 加深对事件处理机制的理解 * 通过上下左右键来控制一个小球的位置 */package com.test3;import java.awt.*;import javax.swing.*;im ...
- ubuntu vi上下左右键无法使用?
使用vm安装ubuntu出现vi上下左右键无法正常使用. 执行以下两句就可以了 $sudo apt-get remove vim-common $sudo apt-get install vim
- ArcEngine中使用上下左右键移动地图
转自愿文ArcEngine中使用上下左右键移动地图 因项目需要,需对mapcontrol控件响应上下左右键,从网上找的方法都一样,都值提到了需要设置axMapControl1的KeyIntercept ...
- JS中表格的全选和删除要注意的问题
在项目开发中,由于刚刚开始做项目,我对js还不是很精通,所以在用js对表格的全选和删除中遇到了不少问题,后来通过查找资料解决了,之后总结了一下关于js表格的全选和删除出现的一些问题,希望能帮助到大家. ...
- datagrid-detailview.js easyui表格嵌套
datagrid-detailview.js easyui表格嵌套
- ubuntu中vim下按上下左右键时输入A、B、C、D的问题
ubuntu下使用vi 进行编辑文件时,按上下左右键时,会输入A.B.C.D,这个用起来很不方便.网上查得此问题的原因是: ubuntu系统自带的 vi 不完整导致,解决方法:安装完整的vi $ su ...
- 案例学习总结:原生JS实现表格排序
最近在学习js的表格排序,没想到看不起眼的表格排序实际上却暗含了众多JS知识点.在这里记录一下此次学习过程.希望对大家也有所帮助. 完整的表格排序涉及了下列这些知识点: call方法使用 sort方法 ...
- JS对表格排序(支持对序号,数字,字母,日期)
JS对表格排序(支持对序号,数字,字母,日期) 前不久看到淘宝组件有"对表格排序的插件" 如想要看 可以看这个地址 http://gallery.kissyui.com/KSort ...
随机推荐
- [Pipy]利用pip2pi搭建本地pypi源
当我们一个团队开发一个项目的时候,须要的Python第三方包基本是固定的.每次搭建新环境的时候总是由于各种内外网,https问题花费大量的时间来安装执行环境. 所以搭建一个本地的,小巧的,仅仅包括须要 ...
- tensorflow创建自定义 Estimator
https://www.tensorflow.org/guide/custom_estimators?hl=zh-cn 创建自定义 Estimator 本文档介绍了自定义 Estimator.具体而言 ...
- 使用idea创建web项目
一直使用的是eclipse,有一个项目开发用的是idea,我也尝试着熟悉一下idea,先来创建一个web项目吧 1.idea下载安装使用 官方下载地址:https://www.jetbrains.co ...
- ionic cordova plugin 安装和使用
注意事项 ionic1需要ng-cordova plugin的使用都需要放到deviceready事件的回调中, 设备准备好了才能设备交互 plugin只有在真机上才有效果, 模拟器(部分)和brow ...
- Deep Learning.ai学习笔记_第一门课_神经网络和深度学习
目录 前言 第一周(深度学习引言) 第二周(神经网络的编程基础) 第三周(浅层神经网络) 第四周(深层神经网络) 前言 目标: 掌握神经网络的基本概念, 学习如何建立神经网络(包含一个深度神经网络), ...
- mysql数据类型转换
--CAST(xxx AS 类型) --CONVERT(xxx,类型) --#浮点型转化为int --i='3.35' --cast(i as signed) --cast(sum(money/100 ...
- Effective Java 第三版——79. 避免过度同步
Tips 书中的源代码地址:https://github.com/jbloch/effective-java-3e-source-code 注意,书中的有些代码里方法是基于Java 9 API中的,所 ...
- 开源组件ExcelReport 3.x.x 使用手册(为.netcore而来)
ExcelReport转眼已经开源4年了,期间有很长时间也停止了对它的维护.18年年末有人联系到我,说“兄弟,ExcelReport不错,但什么时候支持.netcore呢?”.我寥寥的回了几句搪塞的话 ...
- Java IO 流总结篇
1. 写在前面的话 I/O ,I 是 Input (输入)的缩写,O是Output (输出) 的缩写,众所周知,人与人之间想要沟通交流,就需要讲彼此都能听懂的语言,比如大家都统一说英语. 人类如果想和 ...
- 12款 JavaScript 表格控件(DataGrid)
JavaScript 表格控件可以操作大数据集的 HTML表格,提供各种功能,如分页.排序.过滤以及行编辑.在本文中,我们整理了13个最好的 JavaScript 表格插件分享给开发人员,开发者可以很 ...