深圳全飞鸿

标题: input输入框点击回车切换到下一个输入框功能 [打印本页]

作者: zhgc 时间: 2023-7-22 21:49
标题: input输入框点击回车切换到下一个输入框功能
已验证的：
//控件联动
$("#form11").on("keydown","input",function(){
var e = event || window.event || arguments.callee.caller.arguments[0];
if(e && e.keyCode==13) {
var inputs = $("#form input");

var idx = inputs.index(this);
alert(idx);
if (idx == inputs.length - 1) {
//if (confirm("最后一个输入框已经输入,是否提交?"))
$("#form").submit();
} else {
inputs[idx + 1].focus();
inputs[idx + 1].select();
}
}
});

$("#form input:text").keypress(function(e) {
if (e.which == 13) {
var inputs = $("#form").find(":text");
var idx = inputs.index(this);
if (idx == inputs.length - 1) {
if($('input[name="d1"]').val()==''||$('input[name="d2"]').val()==''){
layer.msg('条码不能为空');
return false;
}
$("#form").submit();
} else {
inputs[idx + 1].focus(); // 设置焦点
inputs[idx + 1].select(); // 选中文字
}
return false;// 取消默认的提交行为
}
});

作者: zhgc 时间: 2023-7-22 21:50
未验证：

JavaScript：

方法一：回车触发后input框来回切换

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; //不加最后一行eles就直接回到第一个输入框
      }else { //最后的eles是添加的表单提交方法(如果想实现登陆，可以写入登陆方法)
         document.getElementById("form").submit(); //直接form提交
      }
}
}

//回车触发函数
$("input").keydown(function(event){
if (event.keyCode == 13) {
      focusNextInput(this);
}
});

欢迎光临深圳全飞鸿 (http://www.nagomes.com/disc/)