一个简单的数字文本框
前几天刚好需要用到就临时写了个,有需要的人可以用用看,可以校验输入的字符是否为合法字符,限制输入的字符为“0-9、-、.”,验证输入的值是否在规定范围内,出现违规的输入可以根据警告函数自动弹出错误提示,可限制小数位数,支持任意长度的数字。
属性:
MaxValue 设置最大值
MinValue 最小值
NumericDescription 该文本框的描述,用弹出错误提示时输出的信息。
TryParseImperfectThrowException 后台解析失败时是否抛出错误,为false时将使用默认值
DefaultValue 默认值
FractionLength 小数位最大位数
NumericValue 解析文本框得到的数字值
ClientWarning 客户端错误提示函数,如 alert
当格式发生错误的时候,如用复制黏贴的方式在文本框里输入字母后,当文本框失去焦点则会提示 XXXX 格式错误。XXXX取决于NumericDescription 属性;
当输入后的值超出范围时,会自动改变为允许的最大值或最小值。如果用复制黏贴的方式进行输入的当文本框失去焦点则会提示 XXXX 超出范围,必须大于 YYYY小于ZZZZ。XXXX取决于NumericDescription 属性 YYYY 取决于MaxValue ZZZZ取决于MinValue;
以上错误提示必须有设置ClientWarning 才会出现提示;
当TryParseImperfectThrowException为false时,如果错误的数据提交到后台不会抛出错误而会返回DefaultValue 的值
补充下说说设计思路吧,主要说说客户端的验证部分,服务端验证比较简单,因为服务端支持decimal型。
由于JavaScript只支持int和float型的数字,超过就无法正确的转换,所以无法使用parseInt、parseFloat来将输入的文本转换为数字型来比较,所以使用字符串比较的方式来做。
那么怎么使用字符串来比较任意位数的两个数字呢?应该将两个字符串填充为等长的字符串,比如2和100,如果直接进行比较则会变成2比较大,这样的结果显然不是正确的,但如果把2填充为002就会得出正确的结果。如果是小数部分则往右边填充,比如:2.33和100,则应该填充为002.33和100.00。这样的话可以正确的比较正数了,再来就是考虑比较正数与负数、或负数与负数的大小。
当两个数字中第一个数为负数,比如-10和-100,如果再按之前的填充方式将会得到0-10和-100,这样显然是错的,所以一开始要将-号删掉,变成10和100,并且记录下数字是否包含负号。当要填充字符串如上面的-10包含负号的时候进行右对齐并将负号加上变成-010。
当两个数字中第二个数为负数,比如10和-100,照上面的想法删掉负号变成10和100,填充后变成010和100,这样是等长了但加上负号后变成010和-100,这样数字又不等长了。所以当第二个数为负数而第一个数为正数的情况下必须为第一个数的左边多添加一个‘0’变成0010和-100;
这样就可以比较各种情况下数字的大小,而其他的一些功能都是小事了。