自定义JS表单验证函数实现

"一个简单的JavaScript表单验证函数，用于验证邮箱和用户名的合法性。作者提供了自定义的验证方法，包括检查邮箱格式是否符合规范以及用户名是否包含字母、数字和下划线，且长度在特定范围内。" 在网页开发中，表单验证是一个不可或缺的部分，它确保用户输入的数据符合预期格式，从而防止无效数据提交或潜在的安全问题。在这个资源中，作者分享了一个简单的JavaScript表单验证函数，旨在提供一个轻量级且易于维护的解决方案。 函数的核心在于使用正则表达式来检查输入数据的合法性。首先，我们看到`mail`函数用于验证电子邮件地址。这个函数接受一个参数`elementID`，该参数是输入框的ID。函数内部使用了正则表达式`/^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/`来匹配常见的邮箱格式。如果输入的邮箱符合正则表达式，则认为是有效的；否则，显示错误信息。 接下来，`username`函数用于验证用户名。同样，它接收`elementID`作为参数。此函数使用正则表达式`/^[a-zA-Z0-9_]{5,19}$/`来检查用户名是否只包含字母、数字和下划线，并且长度在5到19个字符之间。符合规则的用户名会被标记为有效，否则显示错误信息。 为了提高用户体验，作者还可能定义了`validMsg`和`errorMsg`函数，分别处理验证成功和失败时的信息提示。`lang`属性用于设置错误提示的语言，而`inValidedStr`用于存储未通过验证的字段信息。 这个简单的表单验证函数具有一定的灵活性，可以根据实际需求进行扩展，比如添加更多类型的验证规则，如电话号码、日期格式等。同时，由于其代码结构清晰，对于初级或中级JavaScript开发者来说，理解和定制这个验证函数相对容易。 在实际应用中，可以将这些验证函数与HTML表单元素的`onsubmit`事件关联，以在用户尝试提交表单前进行实时验证。这有助于及时发现并修正输入错误，提升用户交互体验。同时，这种方法也有助于减轻服务器端的验证负担，提高系统整体性能。