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 相关文章推荐
setTimeout自动触发一个js的方法
Jan 15 Javascript
JS实现动态表格的添加,修改,删除功能(推荐)
Jun 15 Javascript
jQuery实现字符串全部替换的方法
Dec 12 Javascript
AngularJS控制器controller给模型数据赋初始值的方法
Jan 04 Javascript
Jqprint实现页面打印
Jan 06 Javascript
JS日程管理插件FullCalendar简单实例
Feb 07 Javascript
webpack构建react多页面应用详解
Sep 15 Javascript
Element UI框架中巧用树选择器的实现
Dec 12 Javascript
世界上最短的数字判断js代码
Sep 09 Javascript
JS使用H5实现图片预览功能
Sep 30 Javascript
基于vue和bootstrap实现简单留言板功能
May 30 Javascript
Vue+Java+Base64实现条码解析的示例
Sep 23 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
用PHP和ACCESS写聊天室(六)
2006/10/09 PHP
php json_encode奇怪问题说明
2011/09/27 PHP
destoon实现调用自增数字从1开始的方法
2014/08/21 PHP
PHP使用ffmpeg给视频增加字幕显示的方法
2015/03/12 PHP
php常量详细解析
2015/10/27 PHP
CI框架使用composer安装的依赖包步骤与方法分析
2016/11/21 PHP
JavaScript Event学习第二章 Event浏览器兼容性
2010/02/07 Javascript
jQuery学习笔记(4)--Jquery中获取table中某列值的具体思路
2013/04/10 Javascript
jQuery表单获取和失去焦点输入框提示效果的实例代码
2013/08/01 Javascript
解析JavaScript中点号“.”的多义性
2013/12/02 Javascript
DOM操作和jQuery实现选项移动操作的简单实例
2016/06/07 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
2016/10/13 Javascript
利用js判断手机是否安装某个app的多种方案
2017/02/13 Javascript
在js中做数字字符串补0(js补零)
2017/03/25 Javascript
浅谈angular.js跨域post解决方案
2017/08/30 Javascript
浅谈 Vue 项目优化的方法
2017/12/16 Javascript
Vue实现点击时间获取时间段查询功能
2020/08/21 Javascript
微信小程序获取音频时长与实时获取播放进度问题
2018/08/28 Javascript
小程序云开发实战小结
2018/10/25 Javascript
Vue Router history模式的配置方法及其原理
2019/05/30 Javascript
python清除字符串里非字母字符的方法
2015/07/02 Python
深入理解python try异常处理机制
2016/06/01 Python
Python整型运算之布尔型、标准整型、长整型操作示例
2017/07/21 Python
详谈python read readline readlines的区别
2017/09/22 Python
Python数据分析之双色球中蓝红球分析统计示例
2018/02/03 Python
对python的unittest架构公共参数token提取方法详解
2018/12/17 Python
Django 迁移、操作数据库的方法
2019/08/02 Python
Python Tornado批量上传图片并显示功能
2020/03/26 Python
详解Python 最短匹配模式
2020/07/29 Python
Python 爬虫性能相关总结
2020/08/03 Python
PyCharm 2020.2 安装详细教程
2020/09/25 Python
HTML5 Canvas锯齿图代码实例
2014/04/10 HTML / CSS
欧舒丹美国官网:L’Occitane美国
2018/02/23 全球购物
25道Java面试题集合
2013/05/21 面试题
Python 数据可视化神器Pyecharts绘制图像练习
2022/02/28 Python
SQL Server Agent 服务无法启动
2022/04/20 SQL Server