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 相关文章推荐
跟我一起学写jQuery插件开发方法(附完整实例及下载)
Apr 01 Javascript
javascript对话框使用方法(警告框 javascript确认框 提示框)
Jan 07 Javascript
Jquery中使用show()与hide()方法动画显示和隐藏图片
Oct 08 Javascript
JS实现图片高亮展示效果实例
Nov 24 Javascript
jQuery获取及设置表单input各种类型值的方法小结
May 24 Javascript
jQuery通用的全局遍历方法$.each()用法实例
Jul 04 Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
Jan 08 Javascript
Vue的移动端多图上传插件vue-easy-uploader的示例代码
Nov 27 Javascript
javascript trie前缀树的示例
Jan 29 Javascript
在Vue项目中引入腾讯验证码服务的教程
Apr 03 Javascript
简单明了区分escape、encodeURI和encodeURIComponent
May 26 Javascript
Vue动态加载图片在跨域时无法显示的问题及解决方法
Mar 10 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
调试WordPress中定时任务的相关PHP脚本示例
2015/12/10 PHP
利用PHPExcel实现Excel文件的写入和读取
2017/04/26 PHP
JQuery开发的数独游戏代码
2010/10/29 Javascript
10款新鲜出炉的 jQuery 插件(Ajax 插件,有幻灯片、图片画廊、菜单等)
2011/06/08 Javascript
JavaScript之编码规范 推荐
2012/05/23 Javascript
基于jquery实现的定时显示与隐藏div广告的实现代码
2013/08/22 Javascript
jQuery设置和获取HTML、文本和值示例
2014/07/08 Javascript
jquery对象和javascript对象即DOM对象相互转换
2014/08/07 Javascript
JS判断客服QQ号在线还是离线状态的方法
2015/01/13 Javascript
js超时调用setTimeout和间歇调用setInterval实例分析
2015/01/28 Javascript
jquery实现简单的遮罩层
2016/01/08 Javascript
浅析JS操作DOM的一些常用方法
2016/05/13 Javascript
jQuery实现iframe父窗体和子窗体的相互调用
2016/06/17 Javascript
纯jQuery实现前端分页功能
2017/03/23 jQuery
WdatePicker.js时间日期插件的使用方法
2017/07/26 Javascript
BootStrap点击保存后实现模态框自动关闭的思路(模态框)
2017/09/26 Javascript
详解vue-cli快速构建vue应用并实现webpack打包
2017/12/13 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
JS/HTML5游戏常用算法之追踪算法实例详解
2018/12/12 Javascript
Vue3.0数据响应式原理详解
2019/10/09 Javascript
Vue实现开关按钮拖拽效果
2020/09/22 Javascript
Vue 集成 PDF.js 实现 PDF 预览和添加水印的步骤
2021/01/22 Vue.js
python开发之函数定义实例分析
2015/11/12 Python
TF-IDF与余弦相似性的应用(二) 找出相似文章
2017/12/21 Python
python3 requests中使用ip代理池随机生成ip的实例
2018/05/07 Python
Python3随机漫步生成数据并绘制
2018/08/27 Python
aec加密 php_php aes加密解密类(兼容php5、php7)
2021/03/14 PHP
纯css3使用vw和vh实现自适应的方法
2018/02/09 HTML / CSS
HTML5语音识别标签写法附图
2013/11/18 HTML / CSS
什么是数组名
2012/05/10 面试题
员工薪酬福利制度
2014/01/17 职场文书
仓库管理制度
2014/01/21 职场文书
党员公开承诺书
2014/03/25 职场文书
《雪儿》教学反思
2014/04/17 职场文书
婚前协议书范本
2014/10/27 职场文书
朋友离别感言
2015/08/04 职场文书