当用户保存详细信息时，Jquery焦点放在第一个inputbox上
当用户保存详细信息时，Jquery焦点放在第一个inputbox上
提问于 2020-04-14 05:19:33
我有四个输入字段名、年龄、城市、保存详细信息(输入type=“按钮”)当用户填写第一个文本框中的数据并按enter，光标移动到下一个文本框，最后当游标在保存按钮时，当用户按enter all details并将光标焦点移到age时。但是，需要的是光标移动到命名文本框。请解决我的问题，下面是我在jquery中使用的代码
//cursor move code
var currentBoxNumber = 0;
$(".cursormove").keyup(function (event) {
if (event.keyCode == 13) {
textboxes = $("input.cursormove");
currentBoxNumber = textboxes.index(this);
console.log(textboxes.index(this));
if (textboxes[currentBoxNumber + 1] != null) {
nextBox = textboxes[currentBoxNumber + 1];
nextBox.focus();
nextBox.select();
event.preventDefault();
return false;
}
}
});
//all entered data send to insert.php when user click save button and reset all fields and focus again to first input
$("#save").click(function () {
$.ajax({
type: "post",
url: "insert.php",
data: $("#frm").serialize(),
//dataType: "dataType",
success: function (response) {
$("<tr></tr>").html(response).appendTo(".table");
$("#frm")[0].reset();
$("#name").focus();
}
});
});
});HTML代码：
<form id="frm">
<div class="form-group">
<label for="name">Name</label>
<input type="text" name="name" id="name" class="form-control cursormove" placeholder="Enter name">
</div>
<div class="form-group">
<label for="age">Age</label>
<input type="text" name="age" id="age" class="form-control cursormove" placeholder="Enter age">
</div>
<div class="form-group">
<label for="city">City</label>
<input type="text" name="city" id="city" class="form-control cursormove" placeholder="Enter city">
</div>
<div class="form-group">
<input type="hidden" id="id" name="id" value="0">
<input type="button" id="save" class="btn btn-success cursormove" value="Save Details" >
</div>
</form>回答 2
Stack Overflow用户
回答已采纳
发布于 2020-05-10 10:32:23
我解决了这个问题
var currentBoxNumber = 0;
$(".cursormove").keydown(function (event) {
if (event.keyCode == 13) {
textboxes = $("input.cursormove");
currentBoxNumber = textboxes.index(this);
console.log(textboxes.index(this));
if (textboxes[currentBoxNumber + 1] != null) {
nextBox = textboxes[currentBoxNumber + 1];
nextBox.focus();
nextBox.select();
event.preventDefault();
return false;
}
});Stack Overflow用户
发布于 2020-04-14 07:24:35
你的代码看上去很好。但是，只有当您的jQuery中的Id和类名匹配正确时。确保您的名字输入有正确的id <input id="name"和年龄输入有另一个id。
添加HTML代码以进行更多调查。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61201137
复制相关文章
相似问题
腾讯云开发者
