[翻译]基于ASP.NET的NumericTextBox控件[Carol]

weixin_33674976

于 2019-06-26 18:49:41 发布

阅读量242

点赞数

文章标签：测试 php javascript ViewUI

原文链接：http://www.cnblogs.com/dotLive/archive/2007/10/15/924620.html

版权

原文地址：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)