做项目时,客户提出这样一个要求,在列表中的文本框里输入数据时,要能够通过上下左右键来切换光标,按回车键就把光标移到下一个文本框。这样就省得一直去用鼠标了,操作起来更方便。 不废话,上代码。 复制代码 代码如下: <asp:GridView id="gdv" runat="server" AllowPaging="True" PageSize="50" AutoGenerateColumns="False" EnableModelValidation="True" Width="100%" PagerStyle-HorizontalAlign="Center"> <PagerSettings Visible="False" /> <PagerStyle HorizontalAlign="Center" /> <RowStyle HorizontalAlign="Center" /> <Columns> <asp:TemplateField HeaderText="序号"> <ItemTemplate> <asp:Label ID="lbl" runat="server" Text="<%# Container.DataItemIndex+1%>"></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="名称"> <ItemTemplate> <asp:TextBox ID="BarCode" runat="server" Width="200px" MaxLength="10"></asp:TextBox> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="数量"> <ItemTemplate> <asp:TextBox ID="SusFillCount" runat="server" Width="200px" onkeypress="if (event.keyCode < 48 || event.keyCode >57) event.returnValue = false;" MaxLength="5"></asp:TextBox> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> 复制代码 代码如下: jquery代码 <script type="text/javascript" src="jquery-1.4.4.min.js"></script> <script type="text/javascript"> $(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; } } }); }); </script> 搞定!
推荐阅读
iframe异步加载实现点击左边菜单加载右边内容实例讲解
关于iframe异步加载,我们常用的大都是左边菜单栏右边是内容页面,要求我们不能左边菜单不能刷新的情况下,异步加载右边的内容页面。
话不多说,做了一个实例大致是这样的:
1、首先在你的项目中建立三个文件如:>>>详细阅读
本文标题:通过上下左右键和回车键切换光标实现代码
地址:http://www.17bianji.com/kaifa2/JS/22262.html
1/2 1