原文地址：http://www.codeproject.com/useritems/ASPNET_NumericTextBox.asp
demo下载

源码下载

基于ASP.NET的NumericTextBox控件<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

原作者：Lukas Holota  译者：Carol

只允许用户输入数字的ASP.NET控件

导言：

所有的程序都必须是“傻瓜式”的，因此我们正创建检验用户输入的控件，这便是其中之一。在这个网站（译者注：codeproject）我只找到了针对windows forms的解决方案。以下是ASP.NET解决方案的展示：

首先，对于控件有这样一个概念，它必须具备以下能力：

• 可选择输入负数
• 可选择输入小数或整数
• 可以从语言环境设置中自由选择或下载小数分隔符
• 处理ctrl+v
• 具备跨浏览器的兼容性

解决方案——关键点

• 处理所有的字符――最后我选择了“onkeypress”事件，因为如果基于这一事件的方法返回错误的话，字符将不会被键入文本框
• 过滤字符――所有字符都只有一个键代码，所以我只得把被允许的字符都列了个清单（由数字键盘上输入的数字与键盘顶行输入的数字的代码是不同的）并且像Shift, BackSpace, Delete and arrows这些功能键都必须是被允许的－只需一会儿的检测
• 可选择减号――减号必须是这一数值的第一个字符，因此我必须对有兼容性问题的光标位置进行校对，最后解决如下：

·                 function getCursorPosition(txt)

·                 {

·                     if(document.selection) // IE

·                     {

·                         txt.focus();

·                         var oSel = document.selection.createRange();

·                         oSel.moveStart('character', -txt.value.length);

·                         return oSel.text.length;

·                     }

·                     else(txt.selectionStart) // Firefox etc.

·                         return txt.selectionStart;

·                 }

• 可选择小数分隔符――哪一个？――这一控件允许输入小数或整数，但是不同国家使用不同的小数分隔符，所以我制作了一个能根据文化背景动态下载设置的方法：

private char GetDecimalSeparatorFromLocale()

{

return (System.Globalization.CultureInfo.CurrentUICulture.NumberFormat.NumberDecimalSeparator.ToCharArray())[0];

}

• 小数分隔符必须符合一下几个条件：
• 必须是第一个字符
• 必须不是在减号后面
• 在一个数值中必须只有一个小数分隔符

这一“优美”的条件可检测所有这些条件：

if(txt.value.replace("-", "").length > 0 && getCursorPosition(txt) > 0 && txt.value.indexOf(decimalSeparator) == -1 && decimals)

return true;

else

return false;

break;

。处理Ctrl + V——我曾多次去解决这一问题，最后最简单的方法却运作地最好，在“onchage”事件中有一检测方法。除了数字，可选择地减号以及小数字符外，不管字符是否被允许，都可以被检测

Collapse

function CheckString(txt, negative, decimals, decimalSeparator)

{

var res = "";

var decimalSeparatorCount = 0;

for(i = 0; i < txt.value.length; i++)

{

if(i == 0 && txt.value.charAt(0) == "-" && negative)

res = "-";

else

{

if(IsNumber(txt.value.charAt(i))) // IsNumber function returns true if the char is 0-9

res += txt.value.charAt(i);

else

{

if(txt.value.charAt(i) == decimalSeparator && decimalSeparatorCount == 0 && decimals)

{

res += txt.value.charAt(i);

decimalSeparatorCount++;

}

}

}

}

txt.value = res;

}

• 跨浏览器的兼容性
• 就如我上文提到的，IE6，7对于确定光标位置有问题
• Safari为不同的功能键返回不同的键代码－对所有的键返回0，但是数字以及其他一些不被允许的字符的代码运行正常
• 已被检测的浏览器：IE 6,7, Opera 9, Firefox 2, Safari for windows beta 3, Netscape 8 (与firefox一样, 用于 Gecko engine)

使用代码

使用这一代码很简便，因为它继承了文本框格式，因此你可以校验和访问文本框里的值

<cp:NumericTextBox AllowNegative="true" AllowDecimals="true" runat="server" ID="NumericTextBox1" />

这一控件主要是基于javascript，因此它可以简单地运用于其他平台。例如PHP, JSP等等，也可以用于ASP.NET。如果把它翻译了，请告知。

ps:这篇文章的控件我还没有用过，如发现有什么Bug，请与原作者联系