HTML的 Input 是這樣下滴

1.                     <inputtype="text" style="ime-mode:disabled" οnkeyup="returnValidateNumber($(this),value)"/>

·            其中那個 Style 是在 IE 瀏覽器下有效用的，可以讓使用者無法在這文字方塊內使用輸入法。

·            而onkeyup 則是我們自己撰寫的 js 啦，完整的 Code 在下面。

驗證只能輸入數字

1.                     functionValidateNumber(e,pnumber)

2.                     {

3.                         if (!/^\d+$/.test(pnumber))

4.                         {

5.                             $(e).val(/^\d+/.exec($(e).val()));

6.                         }

7.                         return false;

8.                     }

demo 是利用 Regex 來將不屬於數字的過濾掉。

實務上經常需要驗證的是有小數點的欄位，網路上搜尋到的一堆是可以輸入「1.2.3456」的這種詭異值，其實只要小改一下 Regex 就可以驗證了。

1.                     functionValidateFloat(e,pnumber)

2.                     {

3.                         if (!/^\d+[.]?\d*$/.test(pnumber))

4.                         {

5.                             $(e).val(/^\d+[.]?\d*/.exec($(e).val()));

6.                         }

7.                         return false;

8.                     }

這樣子就可以輸入整數也可以輸入一個小數點

以上就給有需要的朋友使用啦。

因為有網友說這種玩意兒不需要動用到 jQuery 的確，是不用動用到所以來寫一下 純 javascript 的版本

HTML要有所改變

1.                     <inputtype="text" style="ime-mode:disabled" οnkeyup="return ValidateNumber(this,value)" />

只能輸入數字（純 javascript)

1.                     functionValidateNumber(e,pnumber)

2.                     {

3.                         if (!/^\d+$/.test(pnumber))

4.                         {

5.                             e.value= /^\d+/.exec(e.value);

6.                         }

7.                         return false;

8.                     }

可以輸入小數（純 javascript)

1.                     functionValidateNumber(e,pnumber)

2.                     {

3.                         if (!/^\d+[.]?\d*$/.test(pnumber))

4.                         {

5.                             e.value= /^\d+[.]?\d*/.exec(e.value);

6.                         }

7.                         return false;

8.                     }

2010-07-01補充
2010-07-16增加萬惡的IE才有的錯誤。

有網友說他想要限制只有小數點後一位就好，因此再來小改一下其實重點只有RegExp要改而已

1.                     functionValidateFloat2(e,pnumber)

2.                     {

3.                         if (!/^\d+[.]?[1-9]?$/.test(pnumber))

4.                         {

5.                             e.value= /\d+[.]?[1-9]?/.exec(e.value);

6.                         }

7.                         return false;

8.                     }

如果你是用萬惡的IE那當你一開始就輸入非數字的時候就會送你一個討厭的null因此又要改寫成這樣過濾掉

1.                     if (!/^\d+$/.test(pnumber))

2.                         {

3.                             var newValue = /^\d+/.exec(e.value);

4.                             if (newValue!= null)

5.                             {

6.                                 e.value= newValue;

7.                             }

8.                             else

9.                             {

10.                              e.value= "";

11.                          }

12.                      }

13.                      return false;

jsFiddle

·                                Run again

·                                Edit this fiddle

·                                JavaScript

·                                HTML

·                                CSS

·                                Result

function ValidateNumber(e, pnumber)

{

if (!/^\d+$/.test(pnumber))

{

var newValue =/^\d+/.exec(e.value);

if (newValue != null)

{

e.value = newValue;

}

else

{

e.value = "";

}

}

return false;

}

function ValidateFloat(e, pnumber)

{

if (!/^\d+[.]?\d*$/.test(pnumber))

{

var newValue = /^\d+[.]?\d*/.exec(e.value);

if (newValue != null)

{

e.value = newValue;

}

else

{

e.value = "";

}

}

return false;

}

function ValidateFloat2(e, pnumber)

{

if (!/^\d+[.]?[1-9]?$/.test(pnumber))

{

var newValue = /\d+[.]?[1-9]?/.exec(e.value);

if (newValue != null)

{

e.value = newValue;

}

else

{

e.value = "";

}

}

return false;

}

jsFiddle

·                                Run again

·                                Edit this fiddle

·                                JavaScript

·                                HTML

·                                CSS

·                                Result

<p><input type="text" style="ime-mode:disabled" οnkeyup="returnValidateNumber(this,value)" />只能輸入數字</p>

<p><input type="text" style="ime-mode:disabled" οnkeyup="returnValidateFloat(this,value)" />可以輸入小數點</p>

<p><input type="text" style="ime-mode:disabled" οnkeyup="returnValidateFloat2(this,value)" />可以輸入小數點（限制小數點後一位）</p>

兼容firefox的文本框只能输入两位小数的数字的代码

分享到：QQ空间新浪微博开心网人人网

<html> 
<body> 
<script> 
function checkNumber(e,txt) 
{ 
var key = window.event ? e.keyCode : e.which; 
var keychar = String.fromCharCode(key); 
var el = document.getElementById('test'); 
var msg = document.getElementById('msg'); 
reg = /\d|\./; 
var result = reg.test(keychar); 
if(result) 
{ 
if(e.keyCode==46) 
result=!(txt.value.split('.').length>1); 
else 
result=!(txt.value.split('.').length>1&&txt.value.split('.')[1].length>1); 
} 
if(!result) 
{ 
el.className = "warn"; 
msg.innerHTML = "只能输入数字"; 
return false; 
} 
else 
{ 
el.className = ""; 
msg.innerHTML = ""; 
return true; 
} 
} 
</script> 
<div id="test"> 
只能输入数字的文本框<inputtype="text" name="question.page" οnkeypress="returncheckNumber(event,this);"> 
<span id="msg"></span> 
</div> 
</body> 
</html>

2011-4-13 17:00 / 标签: javascript 文本框 数字 限制输入 /分类: javascript

邓华锋

Javascript代码 
<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 vaildFloatNumber(evnt){
 evnt=evnt||window.event;
 var keyCode=window.event?evnt.keyCode:evnt.which;
 return keyCode>=48&&keyCode<=57||keyCode==46||keyCode==8;
}
/*只能输入数字，可按退格键删除数字*/
function vaildIntegerNumber(evnt){
 evnt=evnt||window.event;
 var keyCode=window.event?evnt.keyCode:evnt.which;
 return keyCode>=48&&keyCode<=57||keyCode==8;
}
</script>
<input   
onkeypress = "returnvaildFloatNumber(event) "   
onpaste = "return!clipboardData.getData('text').match(/\D/) "   
ondragenter = "returnfalse "   
style = "ime-mode:Disabled "   
/> 
<input   
onkeypress = "returnvaildIntegerNumber(event) "   
onpaste = "return!clipboardData.getData('text').match(/\D/) "   
ondragenter = "returnfalse "   
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	ª	阴性顺序指示符
AB	«	左角引号
AC		[保留] 2
AD		[保留] 2
AE		[保留] 2
AF		[保留] 2
B0	°	温度符
B1	±	加/减号
B2	²	上标 2
B3	³	上标 3
B4		[保留] 2
B5	µ	微符
B6	¶	段落符，pilcrow
B7	·	中点
B8		[保留] 2
B9	¹	上标 1
BA	º	阳性顺序指示符
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
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)

作者：ADforce | 出处：博客园 | 2011/9/13 16:31:03 | 阅读19次

在IE上一般使用Javascript来判断按键码的方法都是通过event.keyCode,但是如果使用者用Firefox却不支持这个语法.在相同情况下，firefox支持e.which。

<script language="javascript">

function onKeyPressBlockNumbers(e)

{

var key = window.event ? e.keyCode:e.which;

var keychar = String.fromCharCode(key);

reg = /\d/;

return !reg.test(keychar);

}

</script>

这个函数的作用是阻止用户输入数字，若只能输入数字则把return !reg.test(keychar)改为return reg.test(keychar);

如下面的输入框在IE和firefox下都不能输入数字：

<input type="text" οnkeypress="return onKeyPressBlockNumbers(event);

在IE上一般使用Javascript来判断按键码的方法都是通过event.keyCode, 但是如果使用者用Firefox却不支持这个语法.在相同情况下，firefox支持e.which。

?

<script language="javascript"> function onKeyPressBlockNumbers(e) { var key = window.event ? e.keyCode:e.which; var keychar = String.fromCharCode(key); reg = /\d/; return !reg.test(keychar); } </script>

这个函数的作用是阻止用户输入数字，若只能输入数字则把 return !reg.test(keychar)改为returnreg.test(keychar);

如下面的输入框在IE和firefox下都不能输入数字：

?

<input type="text" οnkeypress="return onKeyPressBlockNumbers(event);" />

支持IE跟firefox下文本框只能输入数字

2008-10-0711:32:06|  分类： javascript|字号 订阅

//Can only enter numbers
Element.checkNumber = function(element){
   element = $(element);
   Element.observe(element,"keyup",this.handleCheckNumber.bindAsEventListener(element),
          false);

if(document.all){
  Element.observe(element,"propertychange",this.handleCheckNumber.bindAsEventListener(element));
 }else{
  Element.observe(element,"input",this.handleCheckNumber.bindAsEventListener(element));
 }
}

Element.handleCheckNumber = function(event){
 if(isNaN(this.value)){
   this.value = this.value.replace(/\D/g,'');
 }
}

事例：

Element.observe(window, "load",function(){
 Element.checkNumber("<?=$tableColumns[3];?>");
})
注：<?=$tableColumns[3];?>是指的ID。

支持IE与FIREFOX的只能输入数字与退格的文本框

2009年07月16日 星期四 14:56

function isNumber1(evt) {      var iKeyCode = window.event?evt.keyCode:evt.which;         if((iKeyCode>=48) && (iKeyCode<57) ||iKeyCode===8)         {      }     else     {             if (window.event) //IE             {                 event.returnValue = false;             }             else //Firefox             { evt.preventDefault();             }         } } </script> <input name="accountId" type="text" id="accountId" size="10" maxlength="10" οnkeydοwn="isNumber1(event);" >

<html>

<body>

<script>

function checkNumber(e,txt)

{

var key = window.event ? e.keyCode :e.which;

var keychar = String.fromCharCode(key);

var el = document.getElementById('test');

var msg = document.getElementById('msg');

reg = /\d|\./;

var result = reg.test(keychar);

if(result)

{

if(e.keyCode==46)

result=!(txt.value.split('.').length>1);

else

result=!(txt.value.split('.').length>1&&txt.value.split('.')[1].length>1);

}

if(!result)

{

el.className = "warn";

msg.innerHTML = "只能输入数字";

return false;

}

else

{

el.className = "";

msg.innerHTML = "";

return true;

}

}

</script>

<div id="test">

只能输入数字的文本框<inputtype="text" name="question.page" οnkeypress="returncheckNumber(event,this);">

<spanid="msg"></span>

</div>

</body>

</html>

只能输入数字的文本框(兼容ie6,7,8,opera,ff,chrome)

博客分类：

·                                jQuery

ChromeOperajQueryFirefox浏览器

星期天上班真不知道干什么事哦，只好随便看看之前下载的电子书了，在看jQuery基础教程，里面看到一个小例子，拒绝非数字输入，觉得蛮好玩的，跟着那书上了例子把代码打了出来，可是在测试的时候却是有问题的，本来应该是只能输入数字的，可连英文字母都能输入，自己稍微改了一下。 
html源码如下：

Html代码  

JScript.js源码如下：

Js代码  

要注意的就是我们是在文本框的keypress事件上编写代码，即键盘按下的时候我们就要做判断了。。 
之所以要加判断是经本人测试，有些浏览器支持keyCode，有些浏览器支持charCode的，总之以上代码兼容IE6,7,8,oprea,firefox,chrome浏览器。 
以上代码还有一个缺陷就是可以往文本框里输入中文的，请哪位高手帮忙改一下。。。呵呵。。。多谢了。。。

注：如果是要只能输入最多两位小数的正数的话则代码如下：

Js代码