基于jquery扩展文本——之精度文本控件（数字，精度文本）

在我做项目过程中常常会遇到文本控件值只存在数字类型或浮点类型，比如数量，价格。常常我都需要为这值做验证，以及增加用户智能体验，能自动识别等等。从细节做起，让用户体验不一样的方便与智能。添加失去焦点事件，可轻松的实现对数据的验证。代码如下：

1。自定义函数

//控件扩展——精度控件
var Sh_decimal = function (input) {
    var _this = this, _obj, _type, _default, _fun;
    //构造函数
    this.fun_init = function () {
        if (input.obj == undefined) return;
        _obj = input.obj;
        _type = input.type ? input.type : 'int';
        _default = input.def_txt ? input.def_txt : '0';
        _fun = input.fun ? input.fun : function () { };
        _this.fun_click();
    }
    //定义函数事件
    this.fun_click = function () {
        //获取焦点事件
        _obj.focus(function () {
            if ($(this).val() == _default) {
                $(this).val('');
            }
        });
        //失去焦点事件
        _obj.blur(function () {
            var v = $(this).val();
            var _min = $(this).attr('_min');
            switch (_type) {
                case 'int':
                    {
                        if (v.isNumber()) {
                            //判断是否有最小值
                            if (_min && parseInt(v) < parseInt(_min)) {
                                $(this).val(_min);
                                if (_fun && typeof (_fun) == 'function') _fun($(this));
                                return;
                            }
                        } else
                            $(this).val(_default);
                    }; break;
                case 'decimal':
                    {
                        if (v.isDecimal()) {
                            //判断是否有最小值
                            if (parseFloat(v) < parseFloat(_min)) {
                                $(this).val(_min);
                                if (_fun && typeof (_fun) == 'function') _fun($(this));
                                return;
                            }
                            //矫正精度
                            var index = v.indexOf('.');
                            if (index == -1) {
                                $(this).val(v + '.00');
                            } else {
                                var l = v.length - index - 1;
                                for (; l < 2; l++) {
                                    v += '0';
                                }
                                $(this).val(v);
                            }
                        } else
                            $(this).val(_default);
                    }; break;
            }
        });
    }
    //实例化
    _this.fun_init();
}

2。实例调用

 new Sh_decimal({ obj: $('.txt_pay'), type: 'decimal', def_txt: '0.00' }); //金额
 new Sh_decimal({ obj: $('.ps_amount'), type: 'int', def_txt: 1 }); //库存量

从调用来看非常方便，只要实例化该类就能为文本控件实现独特的类型。

以下为示例教程：

Sh_decimal(input)

Contents