基于jquery扩展文本——之精度文本控件(数字,精度文本)
2013-11-20 21:28
447 查看
在我做项目过程中常常会遇到文本控件值只存在数字类型或浮点类型,比如数量,价格。常常我都需要为这值做验证,以及增加用户智能体验,能自动识别等等。从细节做起,让用户体验不一样的方便与智能。代码如下:
1。自定义函数
2。实例调用
从调用来看非常方便,只要实例化该类就能为文本控件实现独特的类型。
新浪微博(求关注)地址:http://weibo.com/zhengdjin
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 }); //库存量
从调用来看非常方便,只要实例化该类就能为文本控件实现独特的类型。
新浪微博(求关注)地址:http://weibo.com/zhengdjin
相关文章推荐
- 基于jquery扩展的弹层控件
- 基于Jquery的文本提示控件 poshytip
- 基于jquery扩展之漂亮的智能感知控件
- 基于Jquery的文本提示控件 poshytip
- 基于jquery扩展漂亮的分页控件(ajax)
- jQuery:收集一些基于jQuery框架开发的控件/jquery插件
- 一个基于jquery的智能提示控件intellSeach.js
- 基于jquery做插件扩展功能
- 基于JQuery实现鼠标点击文本框显示隐藏提示文本
- asp.net自定义服务器控件-基于jquery的AjaxUpload封装的服务器控件
- 收集一些基于jQuery框架开发的控件/jquery插件
- 推荐20款基于 jQuery & CSS 的文本效果插件
- 基于jQuery的GridView-Flexigrid(2)-扩展和修复
- LigerUI是基于jQuery开发的一系列控件组
- 基于jquery,9行js轻松实现tab控件
- 基于jQuery的GridView-Flexigrid(2)-扩展和修复
- 一个基于JQuery的日历时间控件
- jQuery:收集一些基于jQuery框架开发的控件/jquery插件2
- 基于jquery的分页控件(C#)
- 基于jquery实现的服务器验证控件的启用和禁用代码