阿里妈妈的实用表单验证函数集锦

0 下载量 197 浏览量 更新于2024-09-01 收藏 65KB PDF 举报
本文主要介绍了从阿里妈妈获取的几个实用的JavaScript表单验证函数,包括检查浏览器类型、保存表单、验证数据合法性、检查数据长度以及验证URL的正确性。 在网页开发中,表单验证是确保用户输入数据质量的重要环节。阿里妈妈团队分享的这些函数可以帮助开发者更有效地进行客户端验证,提高用户体验并减少服务器端的无效处理。以下是对这些函数的详细解释: 1. **检查当前浏览器是否为Netscape** ```javascript function isNetscape() { app = navigator.appName.substring(0, 1); if (app == 'N') return true; else return false; } ``` 这个函数通过读取`navigator.appName`属性的首字母来判断浏览器是否为Netscape。如果首字母是'N',则返回`true`,表示是Netscape浏览器;否则返回`false`。 2. **保存当前Form表单(仅适用于IE浏览器)** ```javascript function formSaveCheck(fileName) { if (isNetscape()) { alert("Sorry, these function is not supported"); } else document.execCommand('SaveAs', null, fileName); } ``` 这个函数用于尝试保存当前表单数据到本地文件,但只支持Internet Explorer浏览器。如果检测到浏览器不是Netscape(即可能是IE),它会尝试调用`document.execCommand('SaveAs')`方法,传入文件名来保存表单数据。如果浏览器不支持此功能,会弹出提示。 3. **校验数据的合法性** ```javascript function isValidReg(chars) { var re = /<|>|\[|\]|\{|\}|"| 『|』|※|○|●|◎|§|△|▲|☆|★|◇|◆|□|▼|㊣|﹋|⊕|⊙|〒|ㄅ|ㄆ| ㄇ|ㄈ|ㄉ|ㄊ|ㄋ|ㄌ|ㄍ|ㄎ|ㄏ|ㄐ|ㄑ|ㄒ|ㄓ|ㄔ|ㄕ|ㄖ|ㄗ|ㄘ|ㄙ|ㄚ|ㄛ|ㄜ|ㄝ|ㄞ|ㄟ|ㄢ|ㄣ|ㄤ|ㄥ|ㄦ|ㄧ|ㄨ|ㄩ |■|▄|▆|\*|@|#|\^|\\/; if (re.test(chars) == true) { return false; } else { return true; } } ``` 这个函数使用正则表达式检查输入的字符是否包含非法字符,如HTML标签、特殊符号等。如果输入的字符串与正则表达式匹配,则返回`false`,表示包含非法字符;否则返回`true`,表示数据合法。 4. **检查数据的长度是否合法** ```javascript function isValidLength(chars, len) { if (chars.length > len) { return false; } return true; } ``` 此函数用于检查字符串的长度是否超过指定的最大长度`len`。如果长度超过,返回`false`,否则返回`true`。 5. **校验URL的合法性** ```javascript function isValidURL(chars) { var re = /^([hH][tT]{2}[pP]:\/\/"... ``` 这个函数用于验证输入的字符串是否符合URL的格式。由于提供的代码不完整,完整的正则表达式可能用于检查URL的基本结构,包括协议(http或https)、域名、顶级域名等。如果字符串符合URL的结构,函数返回`true`,否则返回`false`。 这些函数可以被集成到表单验证逻辑中,以确保用户提交的数据满足预设的规则。例如,你可以将它们与HTML表单的`onsubmit`事件结合,或者在用户输入时实时进行验证。这样可以避免因用户输入错误导致的错误提交,提升网站的可用性和安全性。