jquery 输入框数字限制插件


Posted in Javascript onNovember 10, 2009

直接看代码:

(function($){ 
var keyCode={ 
BACKSPACE: 8, 
CAPS_LOCK: 20, 
COMMA: 188, 
CONTROL: 17, 
DELETE: 46, 
DOWN: 40, 
END: 35, 
ENTER: 13, 
ESCAPE: 27, 
HOME: 36, 
INSERT: 45, 
LEFT: 37, 
// NUMPAD_ADD: 107, 
// NUMPAD_DECIMAL: 110, 
// NUMPAD_DIVIDE: 111, 
// NUMPAD_ENTER: 108, 
// NUMPAD_MULTIPLY: 106, 
// NUMPAD_SUBTRACT: 109, 
PAGE_DOWN: 34, 
PAGE_UP: 33, 
PERIOD: 190, 
RIGHT: 39, 
SHIFT: 16, 
SPACE: 32, 
TAB: 9, 
UP: 38 
} 
var isControlCode=function(key){ 
for(name in keyCode){ 
if(keyCode[name]==key) 
return true; 
} 
return false; 
} 
var number=function(event){ 
var t=this; 
if(event.shiftKey) 
return false; 
var key=event.keyCode; 
if(isControlCode(key)) 
return; 
if(key<48 || key>105) 
return false; 
if(key>57 && key<96) 
return false; 
} 
var ControlList={}; 
var control=Class.extend({ 
init:function(obj){ 
this.Event=[]; 
this.target=$(obj); 
}, 
Add:function(settings){ 
var t=this; 
t.Event.push(settings); 
return t; 
}, 
Bind:function(){ 
var t=this; 
if(!t.target){ 
return; 
} 
t.target.each(function(){ 
var b=$(this); 
b.bind("keydown",t.event.bind(t)).bind("keyup",t.event.bind(t)); 
if(jQuery.browser.msie) 
{ 
b.bind("paste",t.event.bind(t)); 
} 
else{ 
b.bind("input",t.event.bind(t)); 
} 
}); 
}, 
getmethods:function(type){ 
var t=this; 
var list=[]; 
$(t.Event).each(function(i,item){ 
if(!item.type || !item.method) 
return; 
if(item.type=="all"){ 
list.push(item.method); 
}else 
{ 
if(item.type==type){ 
list.push(item.method); 
} 
} 
}); 
return list; 
}, 
IsSuccess:function(list,event,obj){ 
var istrue=true; 
for(var i=0;i<list.length;i++){ 
if(list[i].call(obj,event)===false) 
{ 
istrue=false; 
break; 
} 
} 
return istrue; 
}, 
event:function(ev){ 
var t=this; 
var event=ev.originalEvent; 
var obj=ev.target; 
return t.IsSuccess(t.getmethods(ev.type),event,obj); 
} 
}); 
control.Add=function(obj,settings){ 
var con= ControlList[this.selector]; 
if(!con) 
{ 
con=new control(obj); 
ControlList[this.selector]=con; 
con.Bind(); 
} 
con.Add(settings); 
return control; 
} 
$.fn.numberable=function(){ 
$(this).css("imeMode","disabled"); 
control.Add(this,{type:"keydown",method:number}).Add(this,{type:"keyup",method:number}); 
function repnumber(event){ 
var o= $(this); 
if(o.val()){ 
o.val(o.val().replace(/[^\d]/g,"")); 
} 
} 
if(jQuery.browser.msie){ 
control.Add(this,{type:"paste",method:function(event){var o=this; 
setTimeout(repnumber.bind(o,event),0); 
} 
}); 
} 
else 
{ 
control.Add(this,{type:"input",method:repnumber}); 
} 
return this; 
} 
})(jQuery);

用法:
$(".class").numberable();

这只是限制了数字,还可以扩展其他的功能,
Javascript 相关文章推荐
Js 获取HTML DOM节点元素的方法小结
Apr 24 Javascript
jquery 事件对象属性小结
Apr 27 Javascript
页面调用单个swf文件,嵌套出多个方法。
Nov 21 Javascript
JavaScript实现的encode64加密算法实例分析
Apr 15 Javascript
JavaScript编程学习技巧汇总
Feb 21 Javascript
jQuery验证插件validate使用详解
May 11 Javascript
js实现带农历和八字等信息的日历特效
May 16 Javascript
Vue 2.0的数据依赖实现原理代码简析
Jul 10 Javascript
深入理解react-router 路由的实现原理
Sep 26 Javascript
ES6知识点整理之函数对象参数默认值及其解构应用示例
Apr 17 Javascript
Vue双向绑定实现原理与方法详解
May 07 Javascript
详解nginx配置vue h5 history去除#号
Nov 09 Javascript
通过隐藏option实现select的联动效果
Nov 10 #Javascript
Riot.js 快速的JavaScript单元测试框架
Nov 09 #Javascript
asp.net HttpHandler实现图片防盗链
Nov 09 #Javascript
为javascript添加String.Format方法
Aug 11 #Javascript
prototype 中文参数乱码解决方案
Nov 09 #Javascript
jQuery 常见学习网站与参考书
Nov 09 #Javascript
Javascript select下拉框操作常用方法
Nov 09 #Javascript
You might like
Terran热键控制
2020/03/14 星际争霸
使用无限生命期Session的方法
2006/10/09 PHP
php采用curl实现伪造IP来源的方法
2014/11/21 PHP
PHP 搜索查询功能实现
2016/11/29 PHP
PhpStorm本地断点调试的方法步骤
2018/05/21 PHP
javascript数组组合成字符串的脚本
2021/01/06 Javascript
关于全局变量和局部变量的那些事
2013/01/11 Javascript
JS中for循序中延迟加载动态效果的具体实现
2013/08/18 Javascript
Jquery实现显示和隐藏的4种简单方式
2013/08/28 Javascript
JS实现网页上随滚动条滚动的层效果代码
2015/11/04 Javascript
jQuery获取Table某列的值(推荐)
2017/03/03 Javascript
nodejs6下使用koa2框架实例
2017/05/18 NodeJs
详解vue项目首页加载速度优化
2017/10/18 Javascript
详解如何将 Vue-cli 改造成支持多页面的 history 模式
2017/11/20 Javascript
基于VuePress 轻量级静态网站生成器的实现方法
2018/04/17 Javascript
Vuex 快速入门(简单易懂)
2018/09/20 Javascript
详解vue项目接入微信JSSDK的坑
2018/12/14 Javascript
详解用Webpack与Babel配置ES6开发环境
2019/03/12 Javascript
Vue+Typescript中在Vue上挂载axios使用时报错问题
2019/08/07 Javascript
BootStrap前端框架使用方法详解
2020/02/26 Javascript
JS async 函数的含义和用法实例总结
2020/04/08 Javascript
多个Vue项目部署到服务器的步骤记录
2020/10/22 Javascript
Python创建日历实例
2014/08/21 Python
python二分查找算法的递归实现方法
2016/05/12 Python
python编程通过蒙特卡洛法计算定积分详解
2017/12/13 Python
对python多线程与global变量详解
2018/11/09 Python
Python中按值来获取指定的键
2019/03/04 Python
python实现得到当前登录用户信息的方法
2019/06/21 Python
python生成并处理uuid的实现方式
2020/03/03 Python
Django ModelForm操作及验证方式
2020/03/30 Python
h5页面唤起app如果没安装就跳转下载(iOS和Android)
2020/06/03 HTML / CSS
Wedgwood美国官网:英国骨瓷,精美礼品及家居装饰
2018/02/17 全球购物
优秀工作者事迹材料
2014/12/26 职场文书
《家世》读后感:看家训的力量
2019/12/30 职场文书
Python中第三方库Faker的使用详解
2022/04/02 Python
Linux服务器离线安装 nginx的详细步骤
2022/06/16 Servers