在以下代码中;您可以选择要插入的整数,并清除它们。如果单击X,它会清除它,但是当您尝试输入新数字时,它什么也不做。请帮我解决这个问题。谢谢!
<script>
$(function() {
var current = 1;
$(".pw").keyup(function () {
if (this.value.length == this.maxLength) {
$(this).next('.pw').focus();
}
});
$('.btn').click(function() {
var clicked = $(this).attr('id');
var pw = 1234;
if (clicked == "X") {
for (i=0;i<5;i++) {
$("#pw_"+i).removeAttr('value');
}
}
else {
$("#pw_"+current).attr('value', clicked);
current = current +1;
}
});
});
</script>
</head>
<body>
<div id="lock">
<h1 id="title">Login</h1>
<div id="password">
<input class="pw" type="password" maxlength="1" id="pw_1" disabled>
<input class="pw" type="password" maxlength="1" id="pw_2" disabled>
<input class="pw" type="password" maxlength="1" id="pw_3" disabled>
<input class="pw" type="password" maxlength="1" id="pw_4" disabled>
</div>
<div id="input">
<div id="row_1">
<div id="1" class="num_1 left btn">1</div>
<div id="2" class="num_1 middle btn">2</div>
<div id="3" class="num_1 right btn">3</div>
</div>
<div id="row_2">
<div id="4" class="num_2 left btn">4</div>
<div id="5" class="num_2 middle btn">5</div>
<div id="6" class="num_2 right btn">6</div>
</div>
<div id="row_3">
<div id="7" class="num_3 left btn">7</div>
<div id="8" class="num_3 middle btn">8</div>
<div id="9" class="num_3 right btn">9</div>
</div>
<div id="row_4">
<div id="X" class="num_4 left btn">X</div>
<div id="0" class="num_4 middle btn">0</div>
<div id="Submit" class="num_4 right btn">></div>
</div>
</div>
</div>
</body>
答案 0 :(得分:1)
因为您忘记将current
重置为1
。
$(function () {
var current = 1;
$(".pw").keyup(function () {
if (this.value.length == this.maxLength) {
$(this).next('.pw').focus();
}
});
$('.btn').click(function () {
var clicked = $(this).attr('id');
var pw = 1234;
if (clicked == "X") {
for (i = 0; i < 5; i++) {
$("#pw_" + i).removeAttr('value');
current = 1;
}
} else {
$("#pw_" + current).attr('value', clicked);
current = current + 1;
}
});
});