<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<script src="./jquery-1.7.1.min.js"></script>
<script>
$(function(){
$("#table1").addKeyEvent(callBack);
$("#table2").addKeyEvent(callBack);
});
function callBack(input){
//console.log(input);
}
jQuery.fn.extend({
eventTable:{
_this:this
},
setCursorPosition:function(elem, index){
if(!elem){
return;
}
var val = elem.value
var len = val.length
// 超过文本长度直接返回
if (len < index) return
elem.focus()
if (elem.setSelectionRange) { // 标准浏览器
elem.setSelectionRange(index, index)
} else { // IE9-
var range = elem.createTextRange()
range.moveStart("character", -len)
range.moveEnd("character", -len)
range.moveStart("character", index)
range.moveEnd("character", 0)
range.select()
}
},
addInputClass:function(){
var trs = $(this).find("tr");
var _this = $(this);
trs.each(function(i,tr){
var tds = $(tr).find("td");
tds.each(function(k,td){
var inputs = $(td).find("input[type='text']");
inputs.each(function(j,input){
$(input).addClass("X-T-Y_"+(i+1)+"-"+(k+1)+"-"+(j+1));
});
});
});
},
addKeyEvent:function(callBack){
var _this = this;
this.addInputClass();
$("input[type='text']").keydown(function(e){
e = e||window.event;
var tableId = $(e.target).parents("table").attr("id");
if(_this.attr("id")==tableId){
//左
if(e.keyCode == 37){
console.log(_this.attr("id"));
_this.leftKeyEvent(_this,e);
if(callBack){
callBack(e.target);
}
return false;
}
//右
if(e.keyCode == 39){
console.log(_this.attr("id"));
_this.rightKeyEvent(_this,e);
callBack(e.target);
return false;
}
//上
if(e.keyCode == 38){
_this.upKeyEvent(_this,e);
callBack(e.target);
return false;
}
//下
if(e.keyCode == 40){
_this.downKeyEvent(_this,e);
callBack(e.target);
return false;
}
}
});
},
leftKeyEvent:function(_this,e){
var target = e.target;
var classList = target.classList;
var tr = $(target).parents("tr");
var td = $(target).parents("td");
var className;
$.each(classList,function(i,value){
if(value.indexOf("X-T-Y")>-1){
var xyValue = value.split("_")[1].split("-");
var x = parseInt(xyValue[0]);
var t = parseInt(xyValue[1]);
var y = parseInt(xyValue[2]);
if(t>2){
if(td.find("input[type='text']").length==1){
className = "X-T-Y_"+x+"-"+(td.index()-1)+"-"+(tr.find("td").eq(td.index()-2).find("input[type='text']").length);
}else{
if(y==1){
className = "X-T-Y_"+x+"-"+(td.index()-1)+"-"+(tr.find("td").eq(td.index()-2).find("input[type='text']").length);
}else{
className = "X-T-Y_"+x+"-"+(td.index()+1)+"-"+(y-1);
}
}
}else{
if(td.find("input[type='text']").length==1){
className = "X-T-Y_"+x+"-"+(tr.find("td:last-child").index()+1)+"-"+tr.find("td:last-child").find("input[type='text']").length;
}else{
if(y==1){
className = "X-T-Y_"+x+"-"+(tr.find("td:last-child").index()+1)+"-"+tr.find("td:last-child").find("input[type='text']").length;
}else{
className = "X-T-Y_"+x+"-"+(td.index()+1)+"-"+(y-1);
}
}
}
}
});
var tableId = $(target).parents("table").attr("id");
var input = $("#"+tableId+" ."+className);
input.focus();
_this.setCursorPosition(input.get(0),input.val()?input.val().length:1);
},
rightKeyEvent:function(_this,e){
var target = e.target;
var classList = target.classList;
var tr = $(target).parents("tr");
var td = $(target).parents("td");
var className;
$.each(classList,function(i,value){
if(value.indexOf("X-T-Y")>-1){
var xyValue = value.split("_")[1].split("-");
var x = parseInt(xyValue[0]);
var t = parseInt(xyValue[1]);
var y = parseInt(xyValue[2]);
if(t==tr.find("td").length){
if(td.find("input[type='text']").length==1){
className = "X-T-Y_"+x+"-"+2+"-"+1;
}else{
if(y==(td.find("input[type='text']").length)){
className = "X-T-Y_"+x+"-"+2+"-"+1;
}else{
className = "X-T-Y_"+x+"-"+(td.index()+1)+"-"+(y+1);
}
}
}else{
if(td.find("input[type='text']").length==1){
className = "X-T-Y_"+x+"-"+(td.index()+3)+"-"+1;
}else{
if(y==td.find("input[type='text']").length){
className = "X-T-Y_"+x+"-"+(td.index()+3)+"-"+1;
}else{
className = "X-T-Y_"+x+"-"+(td.index()+1)+"-"+(y+1);
}
}
}
}
});
var tableId = $(target).parents("table").attr("id");
var input = $("#"+tableId+" ."+className);
input.focus();
_this.setCursorPosition(input.get(0),input.val()?input.val().length:1);
},
upKeyEvent:function(_this,e){
var target = e.target;
var classList = target.classList;
var className;
var tr = $(target).parents("tr");
var td = $(target).parents("td");
var x,t;
$.each(classList,function(i,value){
if(value.indexOf("X-T-Y")>-1){
var xyValue = value.split("_")[1].split("-");
x = parseInt(xyValue[0]);
t = parseInt(xyValue[1]);
var y = parseInt(xyValue[2]);
if(x>1){
x -= 1;
className = "X-T-Y_"+x+"-"+t+"-"+y;
}else{
x = _this.find("tr").length;
className = "X-T-Y_"+x+"-"+t+"-"+y;
}
}
});
var tableId = $(target).parents("table").attr("id");
var input = $("#"+tableId+" ."+className);
if(input.length){
input.focus();
}else{
className = "X-T-Y_"+x+"-"+2+"-"+1;
input = $("#"+tableId+" ."+className);
input.focus();
}
_this.setCursorPosition(input.get(0),input.val()?input.val().length:1);
},
downKeyEvent:function(_this,e){
var target = e.target;
var classList = target.classList;
var className;
var tr = $(target).parents("tr");
var td = $(target).parents("td");
var x,t;
$.each(classList,function(i,value){
if(value.indexOf("X-T-Y")>-1){
var xyValue = value.split("_")[1].split("-");
x = parseInt(xyValue[0]);
t = parseInt(xyValue[1]);
var y = parseInt(xyValue[2]);
if(x==(_this.find("tr").length)){
x = 1;
className = "X-T-Y_"+x+"-"+t+"-"+y;
}else{
x += 1;
className = "X-T-Y_"+x+"-"+t+"-"+y;
}
}
});
var tableId = $(target).parents("table").attr("id");
var input = $("#"+tableId+" ."+className);
if(input.length){
input.focus();
}else{
className = "X-T-Y_"+x+"-"+2+"-"+1;
input = $("#"+tableId+" ."+className);
input.focus();
}
_this.setCursorPosition(input.get(0),input.val()?input.val().length:1);
}
});
</script>
<body>
<table cellpadding="0" id="table1" cellspacing="0" class="tab03">
<tr>
<td class="td03">投递局号：</td><td><input type="text" value="35000316福州华林投递局" class="text02"/></td>
<td class="td03">销号日期：</td><td><input type="text" value="2015.04.23" class="text05"/></td>
<td class="td03">销号班次：</td><td><input type="text" value="2" class="text05"/></td>
</tr>
<tr>
<td class="td03">邮件种类：</td><td><input type="text" value="" class="text01"/>清单类型：<input type="text" value="1 全部" class="text05"/></td>
<td class="td03">投递日期：</td><td><input type="text" value="2015.04.23" class="text05"/></td>
<td class="td03">投递班次：</td><td><input type="text" value="2" class="text05"/></td>
</tr>
<tr>
<td class="td03">妥投标志：</td><td><input type="text" value="" class="text01"/></td>
<td class="td03">投<span class="kg03">递<
方向键盘控制table内的input标签焦点
需积分: 50 107 浏览量
2015-06-08
19:13:22
上传
评论
收藏 34KB ZIP 举报
方向键盘控制table内的input标签焦点.zip （2个子文件） 
jquery-1.7.1.min.js 92KB
test.html 10KB资源评论
逆战风
- 粉丝: 0
- 资源: 2
最新资源
- 微信小程序源码 车源宝 二手车交易平台 源码下载
- 微信小程序源码 实现 城市切换 demo 根据城市首字母排序城市 选择城市 源码下载
- VMware7.0虚拟机硬盘无法编辑，无法连接到Profile-Driven Storage Service
- arm64内核的mongo镜像
- 基于stm32f103c单片机+MPU6050+0.96英寸OLED显示屏双柄遥控器硬件（原理图+PCB）工程文件.zip
- 整理的关于少儿编程的学习路径，以及如何在小升初，初升高和大学充分的利用起来编程经验的优势
- nhit完整源码+论文学习
- 足球比赛结果统计表2006-2011年大约28W场比赛
- 基于PHP+mysql的社区交流系统（源代码）
- yolov5,SSD 可能使用到的一些代码
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
