数字输入框(价格输入框)
html代码
<!doctype html> <html> <head> <meta charset="utf-8"> <title>价格录入限定</title> <script type="text/javascript" src="static/commons/js/jquery-2.0.3.min.js" ></script> <script type="text/javascript" src="amount.js" ></script> <script> $(function(){ $("input[name=city]").amount(); }); </script> </head> <body> <input type="text" name="city" value="" max="99996" int="false" /> <input type="text" name="city" value="" max="99998" int="false" /> <input type="text" name="city" value="" max="999995" int="false" /> </body> </html>
js代码:
(function($) { $.fn.amount = function() { /** * 实时动态强制更改用户录入 * arg1 inputObject **/ return this.each(function() { var $this = $(this); var isInput = $this.is('input'); var _events = []; var len = $this.attr("max").split(".")[0].length; var isInt = $this.attr("int") == "true" ? true : false; _attachEvents(); function _attachEvents() { _detachEvents(); if (isInput) { // single input _events = [ [$this, { blur: $.proxy(overFormat, $this), keyup: $.proxy(keyupEv, $this) }] ]; } for (var i = 0, el, ev; i < _events.length; i++) { el = _events[i][0]; ev = _events[i][1]; el.on(ev); } } function _detachEvents() { for (var i = 0, el, ev; i < _events.length; i++) { el = _events[i][0]; ev = _events[i][1]; el.off(ev); } _events = []; } function keyupEv(e) { var regStrs = [ ['^0(\\d+)$', '$1'], //禁止录入整数部分两位以上,但首位为0 ]; if (!isInt) { regStrs.push(['[^\\d\\.]+$', '']); //禁止录入任何非数字和点 regStrs.push(['\\.(\\d?)\\.+', '.$1']); //禁止录入两个以上的点 regStrs.push(['^(\\d+\\.\\d{2}).+', '$1']); //禁止录入小数点后两位以上 } else { regStrs.push(['[^\\d]+$', '']); //禁止录入任何非数字 } var value = ""; for (i = 0; i < regStrs.length; i++) { var reg = new RegExp(regStrs[i][0]); this.val(this.val().replace(reg, regStrs[i][1])); } value = this.val(); if (value[len] != ".") { value = value.substring(0, len); var reg = new RegExp("^[0-9]*$");; if (reg.test(value)) { this.val(value); } } } /** * 录入完成后,输入模式失去焦点后对录入进行判断并强制更改,并对小数点进行0补全 * arg1 inputObject * 这个函数写得很傻,是我很早以前写的了,没有进行优化,但功能十分齐全,你尝试着使用 * 其实有一种可以更快速的JavaScript内置函数可以提取杂乱数据中的数字: * parseFloat('10'); **/ function overFormat(e) { var th = this; var v = th.val(); var max = th.attr("max"); v = (v - 0) > (max - 0) ? max : v; if (isInt) { th.val(v); return; } if (v === '') { v = '0.00'; } else if (v === '0') { v = '0.00'; } else if (v === '0.') { v = '0.00'; } else if (/^0+\d+\.?\d*.*$/.test(v)) { v = v.replace(/^0+(\d+\.?\d*).*$/, '$1'); v = inp.getRightPriceFormat(v).val; } else if (/^0\.\d$/.test(v)) { v = v + '0'; } else if (!/^\d+\.\d{2}$/.test(v)) { if (/^\d+\.\d{2}.+/.test(v)) { v = v.replace(/^(\d+\.\d{2}).*$/, '$1'); } else if (/^\d+$/.test(v)) { v = v + '.00'; } else if (/^\d+\.$/.test(v)) { v = v + '00'; } else if (/^\d+\.\d$/.test(v)) { v = v + '0'; } else if (/^[^\d]+\d+\.?\d*$/.test(v)) { v = v.replace(/^[^\d]+(\d+\.?\d*)$/, '$1'); } else if (/\d+/.test(v)) { v = v.replace(/^[^\d]*(\d+\.?\d*).*$/, '$1'); ty = false; } else if (/^0+\d+\.?\d*$/.test(v)) { v = v.replace(/^0+(\d+\.?\d*)$/, '$1'); ty = false; } else { v = '0.00'; } } th.val(v); } }); } })(jQuery);
使用说明:
max:输入框所支持的最大值
int:配置输入框是否只输入整数