JS实现商品购买数量加减

1、效果图:

附件中

2、JS验证方法:

    var min=1; 
     function reg(x) { 
        jQuery('#J_Tip').html(""); 
        jQuery('#J_Tip').hide(); 
        return new RegExp("^[1-9]\\d*$").test(x); 
    }
    function amount(obj, mode) { 
        var x = jQuery(obj).val(); 
        if (this.reg(parseInt(x))) { 
            if (mode) { 
                x++; 
            } else { 
                x--; 
            } 
        } else { 
            jQuery('#J_Tip').html("请输入正确的数量!"); 
            jQuery('#J_Tip').show(); 
            jQuery(obj).val(1); 
            jQuery(obj).focus(); 
        } 
        return x; 
    }
    function reduce(obj) { 
        var x = this.amount(obj, false); 
        if (parseInt(x) >= this.min) { 
            jQuery(obj).val(x); 
        } else { 
            jQuery('#J_Tip').html("商品数量最少为" + this.min 
                    + "!"); 
            jQuery('#J_Tip').show(); 
            jQuery(obj).val(1); 
            jQuery(obj).focus(); 
        } 
    }
    function add(obj) { 
        var x = this.amount(obj, true); 
        var max = jQuery('#nAmount').val(); 
        if (parseInt(x) <= parseInt(max)) { 
            jQuery(obj).val(x); 
        } else { 
            jQuery('#J_Tip').html("您所填写的商品数量超过库存!"); 
            jQuery('#J_Tip').show(); 
            jQuery(obj).val(max == 0 ? 1 : max); 
            jQuery(obj).focus(); 
        } 
    }
    function modify(obj) { 
        var x = jQuery(obj).val(); 
        var max = jQuery('#nAmount').val(); 
        if (!this.reg(parseInt(x))) { 
            jQuery(obj).val(1); 
            jQuery(obj).focus(); 
            jQuery('#J_Tip').html("请输入正确的数量!"); 
            jQuery('#J_Tip').show(); 
            return; 
        } 
        var intx = parseInt(x); 
        var intmax = parseInt(max); 
        if (intx < this.min) { 
            jQuery('#J_Tip').html("商品数量最少为" + this.min 
                    + "!"); 
            jQuery('#J_Tip').show(); 
            jQuery(obj).val(this.min); 
            jQuery(obj).focus(); 
        } else if (intx > intmax) { 
            jQuery('#J_Tip').html("您所填写的商品数量超过库存!"); 
            jQuery('#J_Tip').show(); 
            jQuery(obj).val(max == 0 ? 1 : max); 
            jQuery(obj).focus(); 
        } 
    }

3、html代码:

             


              购买数量:
             

             

                - 
                 
                + 
                 
                             
             

你可能感兴趣的:(javaweb开发,js验证,jsp)