jQuery.fn.extend({ numInput: function(opt){ var defaultOptions = { width: 100, wrapperClass: 'num-input-wrap', inputClass: 'num-input', addClass: 'add', subtractClass: 'subtract', positive: true, negative: true, floatCount: 2 }; var options = jQuery.extend(defaultOptions, opt); this._initNumDom(options); }, _initNumDom: function(opt){ for (var i = 0,len = this.length; i < len; i++) { var wrapper = $('
'); wrapper.css({"position": "relative", "display": "inline-block", "vertical-align": "top", "height": 32, "width": opt.width, "border": "1px solid #ccc", "border-radius": 6, "box-sizing": "border-box", "overflow": "hidden"}); console.log; $(this[i]).append(wrapper); var inputN = $(''); inputN.css({"height": 30, "width": "100%", "padding": "0 25px 0 12px", "font-size": "14px", "line-height": "30px", "background": "#fff", "box-shadow": "inset 0 1px 1px rgba(0,0,0,.075)", "box-sizing": "border-box", "border": "none"}); var addBtn = $(''); addBtn.css({"position": "absolute", 'right': 0, 'top': 0, 'width': 25, "height": 15, "border-left": "1px solid #ccc", "box-sizing": "border-box", "cursor": "pointer"}); var subtractBtn = $(''); subtractBtn.css({"position": "absolute", 'right': 0, 'bottom': 0, 'width': 25, "height": 15, "border-left": "1px solid #ccc", "box-sizing": "border-box", "cursor": "pointer"}); wrapper.append(inputN).append(addBtn).append(subtractBtn); this._initNumEvent(inputN, addBtn, subtractBtn, opt) } $('').appendTo('head'); }, _initNumEvent: function(it, ab, sb, opt){ var countDown,quickChange; ab.on('mousedown', function(){ $(this).addClass('deep'); var val = parseFloat($(this).prevAll('input').val()); val = isNaN(val) ? 0 : val; val++; if(val > 0 && !opt.positive){ val = 0; }else if(val < 0 && !opt.negative){ val = 0; } val = Math.round(val*Math.pow(10, opt.floatCount))/Math.pow(10, opt.floatCount); it.val(val); countDown = setTimeout(function(){ quickChange = setInterval(function(){ var val = parseFloat(it.val()); val++; if(val > 0 && !opt.positive){ clearTimeout(countDown); clearInterval(quickChange); val = 0; } val = Math.round(val*Math.pow(10, opt.floatCount))/Math.pow(10, opt.floatCount); it.val(val); },30) },500) }); ab.on('mouseup', function(){ $(this).removeClass('deep'); if(countDown){ clearTimeout(countDown); } if(quickChange){ clearInterval(quickChange); } }); sb.on('mousedown', function(){ $(this).addClass('deep'); var val = parseFloat($(this).prevAll('input').val()); val = isNaN(val) ? 0 : val; val--; if(val < 0 && !opt.negative){ val = 0; }else if(val > 0 && !opt.positive){ val = 0; } val = Math.round(val*Math.pow(10, opt.floatCount))/Math.pow(10, opt.floatCount); it.val(val); countDown = setTimeout(function(){//长按半秒触发快速加减 quickChange = setInterval(function(){ var val = parseFloat(it.val()); val--; if(val < 0 && !opt.negative){ clearTimeout(countDown); clearInterval(quickChange); val = 0; } val = Math.round(val*Math.pow(10, opt.floatCount))/Math.pow(10, opt.floatCount); it.val(val); },30) },500) }); sb.on('mouseup', function(){ $(this).removeClass('deep'); if(countDown){ clearTimeout(countDown); } if(quickChange){ clearInterval(quickChange); } }); it.on('keyup',function(){ var val = $(this).val(); if((opt.positive&&opt.negative)||(!opt.positive&&!opt.negative)){ var reg = new RegExp('^\D*(-?(([1-9]\\d*)?|([0]))?(\\.\\d{0,'+opt.floatCount+'})?)?.*$', 'g'); }else if(!opt.positive&&opt.negative){ var reg = new RegExp('^(-(([1-9]\\d*)?|([0]))?(\\.\\d{0,'+opt.floatCount+'})?)?.*$', 'g'); }else if(opt.positive&&!opt.negative){ var reg = new RegExp('^\D*(([1-9]\d*)?|([0]))?(\.\d{0,'+opt.floatCount+'})?)?.*$', 'g'); } val = val.replace(reg,'$1'); if((val.indexOf('.')==-1||(val.indexOf('.')+1) < val.length)&&val.indexOf('-')==-1){ val = parseFloat(val); val = isNaN(val) ? '' : val; } $(this).val(val) ; }) } });