博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

模仿淘宝点击+号加1点击-号减1

Posted on 2017-03-02 12:34  程序员入门到放弃  阅读(189)  评论(0)    收藏  举报 
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div class="bookNum">
        <a id="sub" href="javascript:void(0);">-</a>
        <input type="text" value="1" id="bookNum">
        <a id="add" href="javascript:void(0);">+</a>
    </div>
    <script src="js/jquery.min-3.0.js"></script>

    <script>
        $("#bookNum").keypress(function(b) {
            var keyCode = b.keyCode ? b.keyCode : b.charCode;
            if (keyCode != 0 && (keyCode < 48 || keyCode > 57) && keyCode != 8 && keyCode != 37 && keyCode != 39) {
            return false;
            } else {
            return true;
            }
            }).keyup(function(e) {
            var keyCode = e.keyCode ? e.keyCode : e.charCode;
            console.log(keyCode);
            if (keyCode != 8) {
            var numVal = parseInt($("#bookNum").val()) || 0;
            numVal = numVal < 1 ? 1 : numVal;
            $("#bookNum").val(numVal);
            }
            }).blur(function() {
            var numVal = parseInt($("#bookNum").val()) || 0;
            numVal = numVal < 1 ? 1 : numVal;
            $("#bookNum").val(numVal);
            });


            //增加
            $("#add").click(function() {
            var num = parseInt($("#bookNum").val()) || 0;
            $("#bookNum").val(num + 1);
            });
            //减去
            $("#sub").click(function() {
            var num = parseInt($("#bookNum").val()) || 0;
            num = num - 1;
            num = num < 1 ? 1 : num;
            $("#bookNum").val(num);
            });
            </script>
</body>
</html>