删除价值后;它变得不可改变?

时间:2014-06-17 01:00:59

标签: jquery

在以下代码中;您可以选择要插入的整数,并清除它们。如果单击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>

1 个答案:

答案 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;
        }
    });
});

fiddle