Javascript限制文本框只能输入数字(兼容浏览器)

发布时间:2020-07-31编辑:脚本学堂
本文介绍了javascript限制文本框只能输入数字的方法,兼容IE、firefox等多个浏览器,textbox中只能输入数字,有需要的朋友参考下。

写在前面,有关文本框只能输入数字的方法,(www.jb200.com)介绍了很多了,不过这篇算是介绍的最为详细的,且附有ASCII 特殊和数字字符、多国字符集对照表等,对于实现textbox仅取输入数字的功能,很有帮助,一起来看看吧。

例子,限制文本框只能输入数字
 

<input  
onkeypress = "return event.keyCode>=48&&event.keyCode<=57||event.keyCode==46"  
onpaste = "return !clipboardData.getData('text').match(/D/)"  
ondragenter = "return false"  
style = "ime-mode:disabled"  
/>  
 

运行效果:
只能输入数字和点: (注:只兼容IE)
说明:
1 只能输入0到9和小数点
2 只能粘贴数字
3 不能拖动内容进来
4 禁止使用输入法

转自:http://www.cnblogs.com/cloudgamer/articles/1138136.html

博主说:
上面代码不兼容火狐等其他浏览器,原因是其他浏览器对Event对象的支持不同.
在火狐下运行以上代码,会出现 event is not defined 的错误提示,在IE中会把event附加成window对象的一个属性,在作为事件处理的一部分访问时会相应填写Event对象所含的数据. 对于基于Netscape的浏览器,则需要作为函数的一个参数传入。
evnt=evnt||window.event;
可对浏览器的兼容.

以上代码的修改版如下:
 

<script type ="text/javascript " >
/*只能输入数字,可按退格键删除数字*/
function vaildIntegerNumber(evnt){
 evnt=evnt||window.event;
 var keyCode=window.event?evnt.keyCode:evnt.which;
 return keyCode>=48&&keyCode<=57||keyCode==8;
}
/*只能输入数字和点,可按退格键删除数字或点*/
function vaildFloatNumber(evnt){
 evnt=evnt||window.event;
 var keyCode=window.event?evnt.keyCode:evnt.which;
 return keyCode>=48&&keyCode<=57||keyCode==46||keyCode==8;
}
/*只能输入数字和一个点,可按退格键删除数字或点*/
/*感谢网友“不远处 ”提供的代码参考,让此方法进一步完美*/
function vailFloatNumberLimitDecimalPoint(evnt,obj){
 evnt=evnt||window.event;
 var keyCode=window.event?evnt.keyCode:evnt.which;
 if(obj.value.indexOf(".")!=-1 && keyCode==46) return false;
 return keyCode>=48&&keyCode<=57||keyCode==46||keyCode==8;
}
/*只能输入数字和一个点,且输入的第一个字符不能为点,可按退格键删除数字或点*/
/*灵活应用,再进一步完美下*/
function vailFloatNumberPerfect(evnt,obj){
 evnt=evnt||window.event;
 var keyCode=window.event?evnt.keyCode:evnt.which;
 if((obj.value.length==0 || obj.value.indexOf(".")!=-1) && keyCode==46) return false;
 return keyCode>=48&&keyCode<=57||keyCode==46||keyCode==8;
}
</script>
<input  
onkeypress = "return vaildIntegerNumber(event) "  
onpaste = "return !clipboardData.getData('text').match(/D/) "  
ondragenter = "return false "  
style = "ime-mode:Disabled "  
/>

<input  
onkeypress = "return vaildFloatNumber(event) "  
onpaste = "return !clipboardData.getData('text').match(/D/) "  
ondragenter = "return false "  
style = "ime-mode:Disabled "  
/>
<input  
onkeypress = "return vaildFloatNumberLimitDecimalPoint(event,this) "  
onpaste = "return !clipboardData.getData('text').match(/D/) "  
ondragenter = "return false "  
style = "ime-mode:Disabled "  
/>
<input  
onkeypress = "return vaildFloatNumberPerfect(event,this) "  
onpaste = "return !clipboardData.getData('text').match(/D/) "  
ondragenter = "return false "  
style = "ime-mode:Disabled "  
/>

在调用用vaildFloatNumber()函数时,需显示传入event对象,以便对ff的兼容.
运行效果:    
 *只能输入数字
 *只能输入数字和点
 *只能输入数字和一个点 
 *只能输入数字和一个点,且输入的第一个字符不能为点 

只能输入数字的另一种方法:
 <input  
onkeyup ="this . value=this.value.replace(/D/g,'') " onafterpaste ="this.value=this .value.replace(/D/g,'') "  />
运行效果:
  *只能输入数字

表 A-1 DEC 多国字符集
 

十六进制代码 MCS 字符或缩写 DEC 多国字符名
ASCII 控制字符 1
00 NUL 空字符
01 SOH 标题起始 (Ctrl/A)
02 STX 文本起始 (Ctrl/B)
03 ETX 文本结束 (Ctrl/C)
04 EOT 传输结束 (Ctrl/D)
05 ENQ 询问 (Ctrl/E)
06 ACK 认可 (Ctrl/F)
07 BEL 铃 (Ctrl/G)
08 BS 退格 (Ctrl/H)
09 HT 水平制表栏 (Ctrl/I)
0A LF 换行 (Ctrl/J)
0B VT 垂直制表栏 (Ctrl/K)
0C FF 换页 (Ctrl/L)
0D CR 回车 (Ctrl/M)
0E SO 移出 (Ctrl/N)
0F SI 移入 (Ctrl/O)
10 DLE 数据链接丢失 (Ctrl/P)
11 DC1 设备控制 1 (Ctrl/Q)
12 DC2 设备控制 2 (Ctrl/R)
13 DC3 设备控制 3 (Ctrl/S)
14 DC4 设备控制 4 (Ctrl/T)
15 NAK 否定接受 (Ctrl/U)
16 SYN 同步闲置符 (Ctrl/V)
17 ETB 传输块结束 (Ctrl/W)
18 CAN 取消 (Ctrl/X)
19 EM 媒体结束 (Ctrl/Y)
1A SUB 替换 (Ctrl/Z)
1B ESC 换码符
1C FS 文件分隔符
1D GS 组分隔符
1E RS 记录分隔符
1F US 单位分隔符
ASCII 特殊和数字字符
20 SP 空格
21 ! 感叹号
22 " 引号 (双引号)
23 # 数字符号
24 $ 美元符
25 % 百分号
26 & 和号
27 ' 省略号 (单引号)
28 ( 左圆括号
29 ) 右圆括号
2A * 星号
2B   加号
2C , 逗号
2D -- 连字号或减号
2E . 句点或小数点
2F / 斜杠
30 0 零
31 1 1
32 2 2
33 3 3
34 4 4
35 5 5
36 6 6
37 7 7
38 8 8
39 9 9
3A : 冒号
3B ; 分号
3C < 小于
3D = 等于
3E > 大于
3F ? 问号
ASCII 字母字符
40 @ 商业 at 符号
41 A 大写字母 A
42 B 大写字母 B
43 C 大写字母 C
44 D 大写字母 D
45 E 大写字母 E
46 F 大写字母 F
47 G 大写字母 G
48 H 大写字母 H
49 I 大写字母 I
4A J 大写字母 J
4B K 大写字母 K
4C L 大写字母 L
4D M 大写字母 M
4E N 大写字母 N
4F O 大写字母 O
50 P 大写字母 P
51 Q 大写字母 Q
52 R 大写字母 R
53 S 大写字母 S
54 T 大写字母 T
55 U 大写字母 U
56 V 大写字母 V
57 W 大写字母 W
58 X 大写字母 X
59 Y 大写字母 Y
5A Z 大写字母 Z
5B [ 左中括号
5C  反斜杠
5D ] 右中括号
5E ^ 音调符号
5F _ 下划线
60 ` 重音符
61 a 小写字母 a
62 b 小写字母 b
63 c 小写字母 c
64 d 小写字母 d
65 e 小写字母 e
66 f 小写字母 f
67 g 小写字母 g
68 h 小写字母 h
69 i 小写字母 i
6A j 小写字母 j
6B k 小写字母 k
6C l 小写字母 l
6D m 小写字母 m
6E n 小写字母 n
6F o 小写字母 o
70 p 小写字母 p
71 q 小写字母 q
72 r 小写字母 r
73 s 小写字母 s
74 t 小写字母 t
75 u 小写字母 u
76 v 小写字母 v
77 w 小写字母 w
78 x 小写字母 x
79 y 小写字母 y
7A z 小写字母 z
7B { 左大括号
7C | 垂直线
7D } 右大括号 (ALTMODE)
7E ~ 代字号 (ALTMODE)
7F DEL 擦掉 (DELETE)
控制字符
80   [保留]
81   [保留]
82   [保留]
83   [保留]
84 IND 索引
85 NEL 下一行
86 SSA 被选区域起始
87 ESA 被选区域结束
88 HTS 水平制表符集
89 HTJ 对齐的水平制表符集
8A VTS 垂直制表符集
8B PLD 部分行向下
8C PLU 部分行向上
8D RI 反向索引
8E SS2 单移 2
8F SS3 单移 3
90 DCS 设备控制字符串
91 PU1 专用 1
92 PU2 专用 2
93 STS 设置传输状态
94 CCH 取消字符
95 MW 消息等待
96 SPA 保护区起始
97 EPA 保护区结束
98   [保留]
99   [保留]
9A   [保留]
9B CSI 控制序列引导符
9C ST 字符串终止符
9D OSC 操作系统命令
9E PM 秘密消息
9F APC 应用程序
其他字符
A0   [保留] 2
A1 ? 反向感叹号
A2 ¢ 分币符
A3 £ 英磅符
A4   [保留] 2
A5 ¥ 人民币符
A6   [保留] 2
A7 § 章节符
A8 ¤ 通用货币符号 2
A9 ? 版权符号
AA a 阴性顺序指示符
AB ? 左角引号
AC   [保留] 2
AD   [保留] 2
AE   [保留] 2
AF   [保留] 2
B0 ° 温度符
B1 ± 加/减号
B2 2 上标 2
B3 3 上标 3
B4   [保留] 2
B5 μ 微符
B6 ? 段落符,pilcrow
B7 · 中点
B8   [保留] 2
B9 1 上标 1
BA o 阳性顺序指示符
BB ? 右角引号
BC ? 分数四分之一
BD ? 分数二分之一
BE   [保留] 2
BF ? 反向问号
C0 à 带重音符的大写字母 A
C1 á 带尖锐重音的大写字母 A
C2 ? 带音调符号的大写字母 A
C3 ? 带代字号的大写字母 A
C4 ? 带元音变音 (分音符号) 的大写字母 A
C5 ? 带铃声的大写字母 A
C6 ? 大写字母 AE 双重元音
C7 ? 带变音符号的大写字母 C
C8 è 带重音符的大写字母 E
C9 é 带尖锐重音的大写字母 E
CA ê 带音调符号的大写字母 E
CB ? 带元音变音 (分音符号) 的大写字母 E
CC ì 带重音符的大写字母 I
CD í 带尖锐重音的大写字母 I
CE ? 带音调符号的大写字母 I
CF ? 带元音变音 (分音符号) 的大写字母 I
D0   [保留] 2
D1 ? 带代字号的大写字母 N
D2 ò 带重音符的大写字母 O
D3 ó 带尖锐重音的大写字母 O
D4 ? 带音调符号的大写字母 O
D5 ? 带代字号的大写字母 O
D6 ? 带元音变音 (分音符号) 的大写字母 O
D7 OE 大写字母 OE 连字 2
D8 ? 带斜杠的大写字母 O
D9 ù 带重音符的大写字母 U
DA ú 带尖锐重音的大写字母 U
DB ? 带音调符号的大写字母 U
DC ü 带元音变音 (分音符号) 的大写字母 U
DD Y 带元音变音 (分音符号) 的大写字母 Y
DE   [保留] 2
DF ? 德语高调小写字母 s
E0 à 带重音符的小写字母 a
E1 á 带尖锐重音的小写字母 a
E2 a 带音调符号的小写字母 a
E3 ? 带代字号的小写字母 a
E4 ? 带元音变音 (分音符号) 的小写字母 a
E5 ? 带铃声的小写字母 a
E6 ? 小写字母 ae 双重元音
E7 ? 带变音符号的小写字母 c
E8 è 带重音符的小写字母 e
E9 é 带尖锐重音的小写字母 e
EA ê 带音调符号的小写字母 e
EB ? 带元音变音 (分音符号) 的小写字母 e
EC ì 带重音符的小写字母 i
ED í 带尖锐重音的小写字母 i
EE ? 带音调符号的小写字母 i
EF ? 带元音变音 (分音符号) 的小写字母 i
F0   [保留] 2
F1 ? 带代字号的小写字母 n
F2 ò 带重音符的小写字母 o
F3 ó 带尖锐重音的小写字母 o
F4 ? 带音调符号的小写字母 o
F5 ? 带代字号的小写字母 o
F6 ? 带元音变音 (分音符号) 的小写字母 o
F7 oe 小写字母 oe 连字 2
F8 ? 带斜杠的小写字母 o
F9 ù 带重音符的小写字母 u
FA ú 带尖锐重音的小写字母 u
FB ? 带音调符号的小写字母 u
FC ü 带元音变音 (分音符号) 的小写字母 u
FD ? 带元音变音 (分音符号) 的小写字母 y 2
FE   [保留] 2
FF   [保留] 2
 

键盘常用ASCII码
 

ESC键 VK_ESCAPE (27)
回车键: VK_RETURN (13)
TAB键: VK_TAB (9)
Caps Lock键: VK_CAPITAL (20)
Shift键: VK_SHIFT ($10)
Ctrl键: VK_CONTROL (17)
Alt键: VK_MENU (18)
空格键: VK_SPACE ($20/32)
退格键: VK_BACK (8)
左徽标键: VK_LWIN (91)
右徽标键: VK_LWIN (92)
鼠标右键快捷键:VK_APPS (93)
Insert键: VK_INSERT (45)
home键: VK_HOME (36)
Page Up: VK_PRIOR (33)
PageDown: VK_NEXT (34)
End键: VK_END (35)
Delete键: VK_DELETE (46)
方向键(←): VK_LEFT (37)
方向键(↑): VK_UP (38)
方向键(→): VK_RIGHT (39)
方向键(↓): VK_DOWN (40)
 
F1键: VK_F1 (112)
F2键: VK_F2 (113)
F3键: VK_F3 (114)
F4键: VK_F4 (115)
F5键: VK_F5 (116)
F6键: VK_F6 (117)
F7键: VK_F7 (118)
F8键: VK_F8 (119)
F9键: VK_F9 (120)
F10键: VK_F10 (121)
F11键: VK_F11 (122)
F12键: VK_F12 (123)
 
Num Lock键: VK_NUMLOCK (144)
小键盘0: VK_NUMPAD0 (96)
小键盘1: VK_NUMPAD0 (97)
小键盘2: VK_NUMPAD0 (98)
小键盘3: VK_NUMPAD0 (99)
小键盘4: VK_NUMPAD0 (100)
小键盘5: VK_NUMPAD0 (101)
小键盘6: VK_NUMPAD0 (102)
小键盘7: VK_NUMPAD0 (103)
小键盘8: VK_NUMPAD0 (104)
小键盘9: VK_NUMPAD0 (105)
小键盘.: VK_DECIMAL (110)
小键盘*: VK_MULTIPLY (106)
小键盘+: VK_MULTIPLY (107)
小键盘-: VK_SUBTRACT (109)
小键盘/: VK_DIVIDE (111)
 
Pause break键: VK_PAUSE (19)
Scroll Lock键: VK_SCROLL (145)

附,说明
 

//以下可以实现只能输入一个小数点
$("#input").live("keypress", this, function (event) {
    if ($(this).val().indexOf(".") != -1 && event.keyCode == 46) return false;
    return event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46;
});
 

这种逻辑也想到了!不仔细想,还以为是个矛盾体!我的理解逻辑:在第一次输入. 时,先是$(this).val().indexOf(".") != -1 && event.keyCode == 46 做判断在输入“.”之前的文本框的值,肯定不符合条件,在进行后面的判断event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46判断,这样就符合条件了,就允许输入了,之后再次输入.时,这次就符合$(this).val().indexOf(".") != -1 && event.keyCode == 46 这个条件了,返回false,不允许再输入了。