ASP.NET与JavaScript轻松实现输入信息验证

╰半夏微凉° 2022-05-14 12:15 50阅读 0赞

无论是在我们平时上网、发邮件、办公、学习和生活中经常会输入一些数据，比如身份证号、邮件账号、数字、汉字、数字字母组合，或者符合某一个规格的输入数据，这是我们想要的输入结果，而结果往往令人差强人意，我们希望使用者输入数字，他偏偏输入汉字，因此软件可能会出现未知错误，用户使用系统的效率也会因此而降低，那么怎么才能解决这一问题呢？

这需要用到一组验证控件，它们常用而方便为我们提供了验证功能，下面让我们看一看它们如何使用。

<table>  
 <span style="font-size:18px">验证控件</span>  
 <tbody> 
  <tr> 
   <th><span style="font-size:18px">验证控件名</span></th> 
   <th><span style="font-size:18px">验证内容</span></th> 
  </tr> 
 </tbody> 
 <tbody> 
  <tr> 
   <td><span style="font-size:18px">RequireFieldValidator</span></td> 
   <td><span style="font-size:18px">验证输入的内容是否为空</span></td> 
  </tr> 
  <tr> 
   <td><span style="font-size:18px">RangeValidator</span></td> 
   <td><span style="font-size:18px">检查输入的信息在某范围内</span></td> 
  </tr> 
  <tr> 
   <td><span style="font-size:18px">RegularExpressionValidator</span></td> 
   <td><span style="font-size:18px">检查输入信息否则正则式</span></td> 
  </tr> 
  <tr> 
   <td><span style="font-size:18px">CompareValidator</span></td> 
   <td><span style="font-size:18px">输入值与某个常数或者控件比较</span></td> 
  </tr> 
  <tr> 
   <td><span style="font-size:18px">CustomValidator</span></td> 
   <td><span style="font-size:18px">服务端或客户端自定义验证规则</span></td> 
  </tr> 
  <tr> 
   <td><span style="font-size:18px">ValidationSummary</span></td> 
   <td><span style="font-size:18px">显示验证控件的验证错误摘要</span></td> 
  </tr> 
 </tbody> 
</table>

<table>  
 <span style="font-size:18px">验证控件相同属性</span>  
 <tbody> 
  <tr> 
   <th><span style="font-size:18px">属性</span></th> 
   <th><span style="font-size:18px">说明</span></th> 
  </tr> 
 </tbody> 
 <tbody> 
  <tr> 
   <td><span style="font-size:18px">ControlToValidate</span></td> 
   <td><span style="font-size:18px">设置为要验证控件ID，无数据则显示ErrorMessage中字符串</span></td> 
  </tr> 
  <tr> 
   <td><span style="font-size:18px">ErrorMessage</span></td> 
   <td><span style="font-size:18px">表示当检查不合法时出现的错误信息</span></td> 
  </tr> 
 </tbody> 
</table>

当然，每个控件根据作用不同有自己的特有属性，下面就来看一下它们自己的特有属性。

**【RequireFieldValidator】**

Display：错误信息的显示方式，Static表示控件的错误信息在页面中占有固定位置，如果没有错误，它的显示类似于Label控件；Dynamic表示控件错误信息出现时占用页面空间；None表示错误出现时不显示提示信息，但是可以在ValidationSummary中显示。

Text：如果Display为Static，不出错时，显示该文本。![1355056673_8171.png][]

代码：

在使用这个控件时，如果这个控件验证不通过，那么其他验证控件都不会起作用，可以说这个是验证通过的前提，至于为什么查了一下是这样的，如果设置了ErrorMessage属性，一旦输入框为空，无论你点击了页面的那个位置，都会有错误提示，而且，Page.IsValid属性的值只能取True，没有办法取得False值，如果输入框为空时，页面都没有办法刷新，不能起作用，自己感觉这样子用起来可能能够达到验证的目的，输入错误时页面不刷新，可能能够减少服务器的负担，但是给人的感觉非常不友好。

**【RangeValidator】**

MaximumValue：范围的最大值。

MinimumValue：范围的最小值。

Text：如果Display为Static，不出错时，显示该文本。

Type：定义控件输入值类型，如String、Integer、Double、Data、Currency等，输入值先转换，再验证。

**【RegularExpressionValidator】**

ValidationExpression：指定的正则表达式。![1355056699_1442.png][]

代码：

**【CompareValidator】**

Equal：当比较的两个值相等时，通过验证。

NotEqual：当比较的两个值不相等时，通过验证。

GreaterThan：当被验证的值大于指定的常数值或控件值时，通过验证。

GreaterThanEqual：当被验证的值大于等于被验证的常数值或控件值时，通过验证。

LessThan：当被验证的值小于指定的常数值或控件值时，通过验证。

LessThanEqual：当被验证的值小于等于被验证的常数值或控件值时，通过验证。

DataTyeCheck：当被验证的值与指定的常数值或控件值类型相同时，通过验证。

ControlToCompare：要进行比较的控件ID.

ValueToCompare:指定要比较的常用值。

![1355056648_5924.png][]

代码：

输入信息验证是每个系统或软件必不可少的功能，安全验证是增强系统安全性、可靠性的前提保证，输入验证智能化是我们发展的趋势，根据用户输入意图，智能输入、智能提示信息，才会是软件更方便用户，例如数据字典的使用，可以自动匹配用户输入信息；验证功能不只有控件可以实现，还可以用一些脚本如JavaScript来处理客户端脚本验证，减少服务器负担，我们需要更智能化的验证方式。

JS表单验证:[http://blog.163.com/qinyixin\_0711/blog/static/139340070201071823916331/][http_blog.163.com_qinyixin_0711_blog_static_139340070201071823916331]

[1355056673_8171.png]: https://img-my.csdn.net/uploads/201212/09/1355056673_8171.png
[1355056699_1442.png]: https://img-my.csdn.net/uploads/201212/09/1355056699_1442.png
[1355056648_5924.png]: https://img-my.csdn.net/uploads/201212/09/1355056648_5924.png
[http_blog.163.com_qinyixin_0711_blog_static_139340070201071823916331]: http://blog.163.com/qinyixin_0711/blog/static/139340070201071823916331/