900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > jquery实现上下左右键盘监听_通过上下左右键和回车键切换光标实现代码

jquery实现上下左右键盘监听_通过上下左右键和回车键切换光标实现代码

时间:2019-09-19 13:32:01

相关推荐

jquery实现上下左右键盘监听_通过上下左右键和回车键切换光标实现代码

客户有这样一个需求在列表中的文本框里输入数据时,要能够通过上下左右键来切换光标,按回车键就把光标移到下一个文本框,接下来将为你介绍下如何实现,感兴趣的朋友可以参考下

做项目时,客户提出这样一个要求,在列表中的文本框里输入数据时,要能够通过上下左右键来切换光标,按回车键就把光标移到下一个文本框。这样就省得一直去用鼠标了,操作起来更方便。

不废话,上代码。

EnableModelValidation="True" Width="100%" PagerStyle-HorizontalAlign="Center">

jquery代码

$(function() {

$("input").eq(0).focus();

$("input[type='text']").keydown(function() {

var key = event.keyCode;

switch (key) {

case 37: //left

{

if ($(this).parent().prev().length >= 1) {

$(this).parent().prev().find("input").focus();

}

break;

}

case 38: //up

{

if ($(this).parent().parent().prev().length >= 1) {

$(this).parent().parent().prev().children().children().eq($(this).parent().prevAll().length).focus();

}

break;

}

case 39: //right

{

if ($(this).parent().next().length >= 1) {

$(this).parent().next().find("input").focus();

}

break;

}

case 40: //down

{

if ($(this).parent().parent().next().length >= 1) {

$(this).parent().parent().next().children().children().eq($(this).parent().prevAll().length).focus();

}

break;

}

case 13: //回车

{

event.keyCode=9;

break;

}

default:

{

break;

}

}

});

});

搞定!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。