JavaScript实现全方位输入验证：长度、非空、数据类型及邮箱/手机验证

本文档主要介绍了在HTML页面中使用JavaScript进行输入验证的方法，针对常见的文本框（TextBox）中的数据有效性进行控制。具体涵盖了以下几个关键知识点： 1. **HTML元素与控件**： - 页面结构中通常包含一个或多个HTML TextBox元素，这些是用户输入数据的基础控件。 - 还有一个Button元素（如btn_Submit），通常用于提交表单数据到服务器。 2. **JavaScript验证函数**： - `verifyInput(input)` 函数是核心验证逻辑，它接受一个TextBox对象作为参数。 - 验证过程分为几个步骤： - **长度验证**：检查输入的字符数量是否超过TextBox的`maxsize`属性定义的最大值。 - **非空验证**：根据`nullable`属性，判断输入是否允许为空。如果设置为`no`，且输入为空，则提示错误并返回false。 - **数据类型验证**： - 对于数字类型，检查输入是否符合正则表达式的要求，确保只接受数值。 - 对于文本类型，通过`IsSafeQuerystring(input.value)`函数检查输入是否包含不安全的字符。 - **邮箱验证**：使用正则表达式检查输入是否符合标准的电子邮件格式。 - **手机号码验证**：检查输入是否符合中国手机号码的规范，包括区号和数字组合形式。 - **电话号码验证**：对电话号码进行更广泛的匹配，允许7-13位数字，或者带有短横线的格式。 3. **错误提示**： - 当验证失败时，会显示相应的错误消息，帮助用户了解哪些输入不符合预期格式。 4. **集成**： - JavaScript代码通常与HTML中的事件处理相关联，比如按钮的`onclick`事件，以便在用户提交表单前触发验证。 通过这个文档，开发者可以学习如何在前端对用户输入的数据进行严格的格式检查，提高用户体验，防止无效数据提交到服务器，从而增强应用程序的安全性和可靠性。