数字微调

<div class="aaa"></div>
<div class="bbb"></div>

<script>
    $(function(){
        $(".aaa").numadjust({exg:false});
        $(".bbb").numadjust({exg:true,exgnum:{min:1,max:10}});
    })
</script>

(function (window, $, undefined) {
    var num=0;
    function btnClick(txtdom,dom,options,bool){
        //条件成立=超出范围
        num=bool===true?parseInt(txtdom.val())+1:parseInt(txtdom.val())-1;
        if (options.exg) {
            //有最大最小限制
            if (num>=options.exgnum.max) {
                bool===true?dom.addClass("noClick"):dom.siblings("span").addClass("noClick");
            }else{
                bool===true?dom.removeClass("noClick"):dom.siblings("span").removeClass("noClick");
            }
            if (num<=options.exgnum.min) {
                bool===true?dom.siblings("span").addClass("noClick"):dom.addClass("noClick");
            }else{
                bool===true?dom.siblings("span").removeClass("noClick"):dom.removeClass("noClick");
            }
            if (bool) {num=num>=options.exgnum.max?options.exgnum.max:num;
            }else{num=num<=options.exgnum.min?options.exgnum.min:num;}
        }else{}
        txtdom.val(num);
    }
    function btnoClick(dom){
        dom.children(‘span‘).addClass("noClick");
    }
    $.extend($.fn, {
        numadjust: function (option) {          
            var numadjustClass={
                exg:false,//默认没有最大最小值
                exgnum:{
                    min:0,
                    max:100
                },
            }
            if ($(this)[0] == null || $(this)[0] == undefined) { return; };
            //进行初始化
            var options=$.extend(numadjustClass,option||{});
            if (options.exgnum.max<options.exgnum.min) { return;};
            //是否有最大最小值
            var flag=false;
            flag=options.exgnum.max==options.exgnum.min?true:false;
            var dom=$(this);
            //添加元素
            dom.find(‘.num‘).remove();
            dom.prepend("<div class=‘num‘><span class=‘jadd‘>+</span><input type=‘text‘ value=‘1‘ class=‘jtxt‘/><span class=‘jcut‘>-</span></div>")

            //定义方法
            var num=dom.find(‘.num‘);      
            var btnadd=num.children(‘.jadd‘);
            var btncut=num.children(‘.jcut‘);
            var txt=num.children(‘.jtxt‘);
            //定义方法
           try{
                //input调整
                var exgNumber=/[^0-9-]+/;
                 $(".jtxt").keyup(function(event) {
                    var txtNum=$(this).val();
                    if (exgNumber.test(txtNum)) {
                        txtNum=flag!=true?options.exgnum.min:0;
                    }else{
                        if (flag!=true) {
                            txtNum=$(this).val()<=options.exgnum.min?options.exgnum.min:txtNum;
                            txtNum=$(this).val()>=options.exgnum.max?options.exgnum.max:txtNum;
                        }else{}
                    }
                    $(this).val(parseInt(txtNum));
                });
                //增加减少数字
                if (flag===true) {
                    btnoClick(num);
                }else{};
                btnadd.click(function(){
                    if (flag!=true) {   
                        btnClick(txt,$(this),options,true);
                    }else{}
                })
               btncut.click(function(){
                    if (flag!=true) {   
                        btnClick(txt,$(this),options,false);
                    }else{}
                })
           }catch(e){}
        },
    })
})(window, Zepto);

 /*初始化 | begin*/
html{font-size: 10px;line-height: 1em;}
body,ul{margin: 0;padding:0;font-size: 1em;}
ul,li{list-style: none;}
input{padding: 0;}
/*初始化 | end*/
.num{overflow: hidden;}
.num span,.num input{font-size:1.2em;float:left;display:block;width:3em;height:3em;text-align: center;line-height:3em;border: 1px solid #e8e8e8;border-radius: 4px;background: #fff;}
.num span{cursor:pointer;}
.num span:first-child{border-radius: 4px 0 0 4px;}
.num span:last-child{border-radius: 0 4px 4px 0;}
.num input{width:4em;border-radius: 0;border-left:0 none;border-right: 0 none;-webkit-appearance: none;}
span.noClick{background-color: #e8e8e8;color: #666;}