限制文本框中只能输入数字

时间：2022-11-05 17:14:21
   现有一需求，不知该如何实现，请教各位？？
要求：
   文本框中只能输入数字，对于输入的非数字，则阻止用户输入该非数字。要兼容ie和firefox???????

32 个解决方案

#1

标签里写：
onKeyPress="if (event.keyCode < 48 || event.keyCode > 57) event.returnValue = false;"

#2

<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">

#3


<script type="text/javascript">
function getEvent() {
    if (document.all) {
        return window.event; //for ie
    }
    func = getEvent.caller;
    while (func != null) {
        var arg0 = func.arguments[0];
        if (arg0) {
            if ((arg0.constructor == Event || arg0.constructor == MouseEvent) || (typeof (arg0) == "object" && arg0.preventDefault && arg0.stopPropagation)) {
                return arg0;
            }
        }
        func = func.caller;
    }
    return null;
}
function doit(){
	var ev = getEvent();
	if(ev.keyCode < 48 || ev.keyCode > 57) return false;
}
</script>
<input type="text" id="txt" onkeydown="return doit()">

#4

+1
引用 3 楼 hookee 的回复:
HTML code

<script type="text/javascript">
function getEvent() {
    if (document.all) {
        return window.event; //for ie
    }
    func = getEvent.caller;
    while (func != null) {
        va……

#5

onkeypress = 'return /^\d$/.test(arguments[0].keyCode)'
onblur = 'this.value = this.value.replace(/\D+/g, "")'

#6

可以兼容ie,火狐，google浏览器么

#7

引用 6 楼 mr*ng 的回复:
可以兼容ie,火狐，google浏览器么

自己去试试不就知道了嘛。。。

#8

引用 1 楼 z_f_p 的回复:
标签里写：
onKeyPress="if (event.keyCode < 48 || event.keyCode > 57) event.returnValue = false;"


这个只能适用于IE  但FF不行

#9

不行啊。中文状态下，输入按shift或空格键就被输入进去了啊

#10

引用 9 楼 mr*ng 的回复:
不行啊。中文状态下，输入按shift或空格键就被输入进去了啊

你每个都测试了？！

#11

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
<input type="text" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" />
</body>
</html>

试试这个

#12

引用 9 楼 mr*ng 的回复:
不行啊。中文状态下，输入按shift或空格键就被输入进去了啊

中文js禁止 不了的，
可以加样式禁用输入法(chrome不会起作用) 

ime-mode:disabled;

#13

那个禁用了输入法的imeMode适合firefox么？？？？

#14

引用 13 楼 mr*ng 的回复:
那个禁用了输入法的imeMode适合firefox么？？？？


适合

#15

zsx841021 ，我试了的，那个好像替换怎么没有效果啊。问下啊，onfaterpast是粘贴后出发的事件么？？？

#16

控制文本框只能输入数字是一个很常见的需求，比如电话号码的输入、数量的输入等，这时候就需要我们控制文本框只能输入数字。在用js控制之后在英文输入法的状态下去敲击键盘上的非数字键是输不进去的，然而当你转到中文输入法的时候输入的是中文，再按空格或回车键，中文或英文字母就输进去了，这时候就需要我们在文本框得到焦点的时候把输入法关闭，就是不响应输入法的切换。如下语句可以实现这样的功能。

 

下面的语句是用jquery写的，控制class为checkNum的文本框只能输入数字和小数点。
Js代码  收藏代码

    //监听键盘，只允许输入数字和小数点  
            $(".checkNum").keypress(function(event) {  
                var keyCode = event.which;  
                if (keyCode == 46 || (keyCode >= 48 && keyCode <=57))  
                    return true;  
                else  
                    return false;  
            }).focus(function() {  
                this.style.imeMode='disabled';  
            });  

 

imeMode有四种形式，分别是：

active 代表输入法为中文
inactive 代表输入法为英文
auto 代表打开输入法 (默认)
disable 代表关闭输入法
可是这个禁用输入法兼容性如何？？？？如果不能兼容该如何解决


#17

引用 15 楼 mr*ng 的回复:
zsx841021 ，我试了的，那个好像替换怎么没有效果啊。问下啊，onfaterpast是粘贴后出发的事件么？？？

什么叫没有效果。。。（onfaterpast是粘贴后出发的事件么？？？）对

#18

 private   void   textBox3_KeyPress(object   sender,   KeyPressEventArgs   e) 
                { 
                        if   (textBox3.SelectionStart   ==   0) 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   ==   0   ||   e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        e.Handled   =   true; 
                                } 
                        } 
                        else 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        if   (e.KeyChar   !=   '\b ') 
                                                e.Handled   =   true; 
                                } 
                        } 
                }

#19

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return;};this.value=this.value.replace(/\D+/g, "")'
onblur = 'this.value = this.value.replace(/\D+/g, "")'/>

回复给你了，四事件组合，牛B轰轰的限制输入，至少兼容Firefox、IE、Chrome。

#20

引用 19 楼 diky87688973 的回复:
<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return……


事件兼容 

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode||event.keycode||event.which))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return;};this.value=this.value.replace(/\D+/g, "")'
onblur = 'this.value = this.value.replace(/\D+/g, "")'/>

#21

引用 20 楼 diky87688973 的回复:
引用 19 楼 diky87688973 的回复:

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\……
这个NB透了!!霸气

#22

引用 20 楼 diky87688973 的回复:
引用 19 楼 diky87688973 的回复:

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/……


太强悍啦~

#23

<input type="text" this.value=value.replace(/[^\d]/g,'')\" onbeforepaste=\"clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))/>

#24

亲测，全部通过：

<input type="text" name="text" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" /> 

结贴给分！

#25

限制文本框中只能输入数字
我怎么测得还是出来了，右键贴的

这么多人 帮看下我的问题
http://topic.csdn.net/u/20111207/21/3bbfb031-0a42-4ed2-9de7-3ebac6dec751.html?57709

#26

引用 20 楼 diky87688973 的回复:
[Quote=引用 19 楼 diky87688973 的回复:]

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return……


事件兼容 

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode||event.keycode||event.which))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return;};this.value=this.value.replace(/\D+/g, "")'
onblur = 'this.value = this.value.replace(/\D+/g, "")'/>
太牛了，感谢分享，正好用到

#27

eeeeeeeeeee

#28

 HTML
<asp:TextBox ID="TextBox36" runat="server"   
                                                onkeypress = "clearNoNum(this)"
                                                oninput= "clearNoNum(this)"
                                                onpropertychange="clearNoNum(this)"
                                                sonblur = "clearNoNum(this)"
                                                style="margin-bottom: 0px;" Width="117px"></asp:TextBox>
JS
<script language="JavaScript" type="text/javascript">
function clearNoNum(obj)
{
   obj.value = obj.value.replace(/[^\d.]/g,"");  //清除“数字”和“.”以外的字符
   obj.value = obj.value.replace(/^\./g,"");  //验证第一个字符是数字而不是.
   obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的.
   obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
</script>

#29

引用 28 楼 suny0002 的回复:
 HTML
<asp:TextBox ID="TextBox36" runat="server"   
                                                onkeypress = "clearNoNum(this)"
                                                oninput= "clearNoNum(this)"
                                                onpropertychange="clearNoNum(this)"
                                                sonblur = "clearNoNum(this)"
                                                style="margin-bottom: 0px;" Width="117px"></asp:TextBox>
JS
<script language="JavaScript" type="text/javascript">
function clearNoNum(obj)
{
   obj.value = obj.value.replace(/[^\d.]/g,"");  //清除“数字”和“.”以外的字符
   obj.value = obj.value.replace(/^\./g,"");  //验证第一个字符是数字而不是.
   obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的.
   obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
</script>

可以输入小数点 并且只允许输入一个

#30

很不错，测试了确实可以

#31

引用 18 楼 buzhidao945 的回复:
 private   void   textBox3_KeyPress(object   sender,   KeyPressEventArgs   e) 
                { 
                        if   (textBox3.SelectionStart   ==   0) 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   ==   0   ||   e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        e.Handled   =   true; 
                                } 
                        } 
                        else 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        if   (e.KeyChar   !=   '\b ') 
                                                e.Handled   =   true; 
                                } 
                        } 
                }


不兼容 火狐哦， 加上后，什么都不能输入了，ie、google试过能兼容。

#32

引用 3 楼 hookee 的回复: 

<script type="text/javascript">
function getEvent() {
    if (document.all) {
        return window.event; //for ie
    }
    func = getEvent.caller;
    while (func != null) {
        var arg0 = func.arguments[0];
        if (arg0) {
            if ((arg0.constructor == Event || arg0.constructor == MouseEvent) || (typeof (arg0) == "object" && arg0.preventDefault && arg0.stopPropagation)) {
                return arg0;
            }
        }
        func = func.caller;
    }
    return null;
}
function doit(){
	var ev = getEvent();
	if(ev.keyCode < 48 || ev.keyCode > 57) return false;
}
</script>
<input type="text" id="txt" onkeydown="return doit()">

马克一下 限制文本框中只能输入数字

#1

标签里写：
onKeyPress="if (event.keyCode < 48 || event.keyCode > 57) event.returnValue = false;"

#2

<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">

#3


<script type="text/javascript">
function getEvent() {
    if (document.all) {
        return window.event; //for ie
    }
    func = getEvent.caller;
    while (func != null) {
        var arg0 = func.arguments[0];
        if (arg0) {
            if ((arg0.constructor == Event || arg0.constructor == MouseEvent) || (typeof (arg0) == "object" && arg0.preventDefault && arg0.stopPropagation)) {
                return arg0;
            }
        }
        func = func.caller;
    }
    return null;
}
function doit(){
	var ev = getEvent();
	if(ev.keyCode < 48 || ev.keyCode > 57) return false;
}
</script>
<input type="text" id="txt" onkeydown="return doit()">

#4

+1
引用 3 楼 hookee 的回复:
HTML code

<script type="text/javascript">
function getEvent() {
    if (document.all) {
        return window.event; //for ie
    }
    func = getEvent.caller;
    while (func != null) {
        va……

#5

onkeypress = 'return /^\d$/.test(arguments[0].keyCode)'
onblur = 'this.value = this.value.replace(/\D+/g, "")'

#6

可以兼容ie,火狐，google浏览器么

#7

引用 6 楼 mr*ng 的回复:
可以兼容ie,火狐，google浏览器么

自己去试试不就知道了嘛。。。

#8

引用 1 楼 z_f_p 的回复:
标签里写：
onKeyPress="if (event.keyCode < 48 || event.keyCode > 57) event.returnValue = false;"


这个只能适用于IE  但FF不行

#9

不行啊。中文状态下，输入按shift或空格键就被输入进去了啊

#10

引用 9 楼 mr*ng 的回复:
不行啊。中文状态下，输入按shift或空格键就被输入进去了啊

你每个都测试了？！

#11

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
<input type="text" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" />
</body>
</html>

试试这个

#12

引用 9 楼 mr*ng 的回复:
不行啊。中文状态下，输入按shift或空格键就被输入进去了啊

中文js禁止 不了的，
可以加样式禁用输入法(chrome不会起作用) 

ime-mode:disabled;

#13

那个禁用了输入法的imeMode适合firefox么？？？？

#14

引用 13 楼 mr*ng 的回复:
那个禁用了输入法的imeMode适合firefox么？？？？


适合

#15

zsx841021 ，我试了的，那个好像替换怎么没有效果啊。问下啊，onfaterpast是粘贴后出发的事件么？？？

#16

控制文本框只能输入数字是一个很常见的需求，比如电话号码的输入、数量的输入等，这时候就需要我们控制文本框只能输入数字。在用js控制之后在英文输入法的状态下去敲击键盘上的非数字键是输不进去的，然而当你转到中文输入法的时候输入的是中文，再按空格或回车键，中文或英文字母就输进去了，这时候就需要我们在文本框得到焦点的时候把输入法关闭，就是不响应输入法的切换。如下语句可以实现这样的功能。

 

下面的语句是用jquery写的，控制class为checkNum的文本框只能输入数字和小数点。
Js代码  收藏代码

    //监听键盘，只允许输入数字和小数点  
            $(".checkNum").keypress(function(event) {  
                var keyCode = event.which;  
                if (keyCode == 46 || (keyCode >= 48 && keyCode <=57))  
                    return true;  
                else  
                    return false;  
            }).focus(function() {  
                this.style.imeMode='disabled';  
            });  

 

imeMode有四种形式，分别是：

active 代表输入法为中文
inactive 代表输入法为英文
auto 代表打开输入法 (默认)
disable 代表关闭输入法
可是这个禁用输入法兼容性如何？？？？如果不能兼容该如何解决


#17

引用 15 楼 mr*ng 的回复:
zsx841021 ，我试了的，那个好像替换怎么没有效果啊。问下啊，onfaterpast是粘贴后出发的事件么？？？

什么叫没有效果。。。（onfaterpast是粘贴后出发的事件么？？？）对

#18

 private   void   textBox3_KeyPress(object   sender,   KeyPressEventArgs   e) 
                { 
                        if   (textBox3.SelectionStart   ==   0) 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   ==   0   ||   e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        e.Handled   =   true; 
                                } 
                        } 
                        else 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        if   (e.KeyChar   !=   '\b ') 
                                                e.Handled   =   true; 
                                } 
                        } 
                }

#19

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return;};this.value=this.value.replace(/\D+/g, "")'
onblur = 'this.value = this.value.replace(/\D+/g, "")'/>

回复给你了，四事件组合，牛B轰轰的限制输入，至少兼容Firefox、IE、Chrome。

#20

引用 19 楼 diky87688973 的回复:
<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return……


事件兼容 

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode||event.keycode||event.which))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return;};this.value=this.value.replace(/\D+/g, "")'
onblur = 'this.value = this.value.replace(/\D+/g, "")'/>

#21

引用 20 楼 diky87688973 的回复:
引用 19 楼 diky87688973 的回复:

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\……
这个NB透了!!霸气

#22

引用 20 楼 diky87688973 的回复:
引用 19 楼 diky87688973 的回复:

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/……


太强悍啦~

#23

<input type="text" this.value=value.replace(/[^\d]/g,'')\" onbeforepaste=\"clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))/>

#24

亲测，全部通过：

<input type="text" name="text" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" /> 

结贴给分！

#25

限制文本框中只能输入数字
我怎么测得还是出来了，右键贴的

这么多人 帮看下我的问题
http://topic.csdn.net/u/20111207/21/3bbfb031-0a42-4ed2-9de7-3ebac6dec751.html?57709

#26

引用 20 楼 diky87688973 的回复:
[Quote=引用 19 楼 diky87688973 的回复:]

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return……


事件兼容 

<input type="text"
onkeypress = 'return /^\d$/.test(String.fromCharCode(event.keyCode||event.keycode||event.which))'
oninput= 'this.value = this.value.replace(/\D+/g, "")'
onpropertychange='if(!/\D+/.test(this.value)){return;};this.value=this.value.replace(/\D+/g, "")'
onblur = 'this.value = this.value.replace(/\D+/g, "")'/>
太牛了，感谢分享，正好用到

#27

eeeeeeeeeee

#28

 HTML
<asp:TextBox ID="TextBox36" runat="server"   
                                                onkeypress = "clearNoNum(this)"
                                                oninput= "clearNoNum(this)"
                                                onpropertychange="clearNoNum(this)"
                                                sonblur = "clearNoNum(this)"
                                                style="margin-bottom: 0px;" Width="117px"></asp:TextBox>
JS
<script language="JavaScript" type="text/javascript">
function clearNoNum(obj)
{
   obj.value = obj.value.replace(/[^\d.]/g,"");  //清除“数字”和“.”以外的字符
   obj.value = obj.value.replace(/^\./g,"");  //验证第一个字符是数字而不是.
   obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的.
   obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
</script>

#29

引用 28 楼 suny0002 的回复:
 HTML
<asp:TextBox ID="TextBox36" runat="server"   
                                                onkeypress = "clearNoNum(this)"
                                                oninput= "clearNoNum(this)"
                                                onpropertychange="clearNoNum(this)"
                                                sonblur = "clearNoNum(this)"
                                                style="margin-bottom: 0px;" Width="117px"></asp:TextBox>
JS
<script language="JavaScript" type="text/javascript">
function clearNoNum(obj)
{
   obj.value = obj.value.replace(/[^\d.]/g,"");  //清除“数字”和“.”以外的字符
   obj.value = obj.value.replace(/^\./g,"");  //验证第一个字符是数字而不是.
   obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的.
   obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
</script>

可以输入小数点 并且只允许输入一个

#30

很不错，测试了确实可以

#31

引用 18 楼 buzhidao945 的回复:
 private   void   textBox3_KeyPress(object   sender,   KeyPressEventArgs   e) 
                { 
                        if   (textBox3.SelectionStart   ==   0) 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   ==   0   ||   e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        e.Handled   =   true; 
                                } 
                        } 
                        else 
                        { 
                                if   (e.KeyChar.CompareTo( '0 ')   <   0   ||   e.KeyChar.CompareTo( '9 ')   >   0) 
                                { 
                                        if   (e.KeyChar   !=   '\b ') 
                                                e.Handled   =   true; 
                                } 
                        } 
                }


不兼容 火狐哦， 加上后，什么都不能输入了，ie、google试过能兼容。

#32

引用 3 楼 hookee 的回复: 

<script type="text/javascript">
function getEvent() {
    if (document.all) {
        return window.event; //for ie
    }
    func = getEvent.caller;
    while (func != null) {
        var arg0 = func.arguments[0];
        if (arg0) {
            if ((arg0.constructor == Event || arg0.constructor == MouseEvent) || (typeof (arg0) == "object" && arg0.preventDefault && arg0.stopPropagation)) {
                return arg0;
            }
        }
        func = func.caller;
    }
    return null;
}
function doit(){
	var ev = getEvent();
	if(ev.keyCode < 48 || ev.keyCode > 57) return false;
}
</script>
<input type="text" id="txt" onkeydown="return doit()">

马克一下 限制文本框中只能输入数字
标签：

相关文章