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 可拖动列表实现代码
Dec 13 Javascript
JavaScript对内存分配及管理机制详细解析
Nov 11 Javascript
jQuery异步上传文件插件ajaxFileUpload详细介绍
May 19 Javascript
jquery中ajax处理跨域的三大方式
Jan 05 Javascript
三个js循环的关键字示例(for与while)
Feb 16 Javascript
javascript正则表达式总结
Feb 29 Javascript
Vue.js学习教程之列表渲染详解
May 17 Javascript
js图片放大镜实例讲解(必看篇)
Jul 17 Javascript
javascript少儿编程关于返回值的函数内容
May 27 Javascript
mpvue将vue项目转换为小程序
Sep 30 Javascript
vue+node实现图片上传及预览的示例方法
Nov 22 Javascript
Selenium执行Javascript脚本参数及返回值过程详解
Apr 01 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
深入mysql_fetch_row()与mysql_fetch_array()的区别详解
2013/06/05 PHP
IE7提供XMLHttpRequest对象为兼容
2007/03/08 Javascript
Jquery 插件开发笔记整理
2011/01/17 Javascript
jquery调用wcf并展示出数据的方法
2011/07/07 Javascript
jQuery Tools Dateinput使用介绍
2012/07/14 Javascript
onbeforeunload与onunload事件异同点总结
2013/06/24 Javascript
JavaScript结合AJAX_stream实现流式显示
2015/01/08 Javascript
JS实现淘宝支付宝网站的控制台菜单效果
2015/09/28 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
2015/10/09 Javascript
使用JavaScript实现ajax的实例代码
2016/05/11 Javascript
漂亮实用的页面loading(加载)封装代码
2017/02/03 Javascript
微信小程序报错:this.setData is not a function的解决办法
2017/09/27 Javascript
用jQuery实现抽奖程序
2020/04/12 jQuery
python数据结构树和二叉树简介
2014/04/29 Python
使用Python中的线程进行网络编程的入门教程
2015/04/15 Python
python取代netcat过程分析
2018/02/10 Python
python设计微型小说网站(基于Django+Bootstrap框架)
2019/07/08 Python
python获取当前文件路径以及父文件路径的方法
2019/07/10 Python
Django跨域请求原理及实现代码
2020/11/14 Python
Python实现列表索引批量删除的5种方法
2020/11/16 Python
pycharm 多行批量缩进和反向缩进快捷键介绍
2021/01/15 Python
萨克斯第五大道精品百货店: Saks Fifth Avenue
2017/04/28 全球购物
德国在线香料制造商:Gewürzland
2020/03/10 全球购物
比较基础的php面试题及答案-编程题
2012/10/14 面试题
什么是TCP/IP
2014/07/27 面试题
QA工程师岗位职责
2013/11/20 职场文书
大学理论知识学习自我鉴定
2014/04/28 职场文书
大学新生军训方案
2014/05/03 职场文书
活动总结的格式
2014/05/07 职场文书
社区戒毒工作方案
2014/06/04 职场文书
群众路线表态发言材料
2014/10/17 职场文书
2014年中班下学期工作总结
2014/12/11 职场文书
演讲稿:​快乐,从不抱怨开始!
2019/04/02 职场文书
.Net Core导入千万级数据至Mysql的步骤
2021/05/24 MySQL
MySQL空间数据存储及函数
2021/09/25 MySQL
基于Python实现将列表数据生成折线图
2022/03/23 Python