本文介绍如何给input输入框、文本框等元素绑定回车事件,实现按键盘上的回车(Enter)快捷键后光标或者焦点自动跳转到下一个元素上的实现方法。
方法一
$(document).ready(function () { $("#txt_JumpPager").keydown(function (e) { var curKey = e.which; if (curKey == 13) { $("#lbtn_JumpPager").click(); return false; } }); });
其中的txt_JumpPager为文本框ID,lbtn_JumpPager为事件按钮ID。
方法二
loginInputForm.find('input').on('keyup',function(){ if(event.keyCode=='13'){ 执行跳到下一个文本框的代码 } })
方法三
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <script type="text/javascript"> //jQuery实现在一个输入框按回车键后光标跳到下一个输入框 function focusNextInput(thisInput) { var inputs = document.getElementsByTagName("input"); for(var i = 0;i<inputs.length;i++){ // 如果是最后一个,则焦点回到第一个(如果想实现按顺序可以登陆,可以写入登陆方法) if(i==(inputs.length-1)){ inputs[0].focus(); break; }else if(thisInput == inputs[i]){ inputs[i+1].focus(); break; } } } </script> </head> <body> <table> 姓名:<input type="text" onkeypress="if(event.keyCode==13) focusNextInput(this);"> 年龄:<input type="text" onkeypress="if(event.keyCode==13) focusNextInput(this);"> 工号:<input type="text" onkeypress="if(event.keyCode==13) focusNextInput(this);"> </table> </body> </html>
这3中方法实现按回车键光标自动跳转使用的函数不太一样,大家可以根据自己的情况选择使用。
更多相关推荐
版权保护:本文《jquery输入框设置回车事件实现按回车键跳到下一个元素上》由<我爱分享>原创,转载请保留链接:http://shuidi365.cn/site/91.html
此博客主要用来分享、推荐自己日常、学习过程中感觉比较实用的经验、IT技术和一些比较好的资源(各种软件、各种开发手册、各种学习资料、各种视频教程等),希望对大家有所帮助,有问题请留言,欢迎来交流,联系QQ邮箱/微信:342807450