jquery输入框设置回车事件实现按回车键跳到下一个元素上
标签:
javascript
jquery
作者:洋洋电脑帮 |
发布时间:2025-03-30 18:24:56 |
阅读:46 |
评论:0
本文介绍如何给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中方法实现按回车键光标自动跳转使用的函数不太一样,大家可以根据自己的情况选择使用。