JavaScript表单验证函数实用集锦

"JavaScript验证函数大全" 在网页开发中，JavaScript是一种常用的客户端脚本语言，用于增强用户交互和数据验证。本资源提供的“JavaScript验证函数大全”集合了一系列用于表单验证的函数，对于确保用户输入的数据符合特定要求非常有帮助。下面我们将详细探讨其中的几个示例函数。 1. 多选按钮检查函数`checkform(obj)`： 这个函数用于验证一个名为`oo`的多选按钮组是否至少有一个被选中。通过循环遍历`oo`数组并检查每个元素的`checked`属性，如果找到一个被选中的选项，函数返回`true`；否则，弹出警告提示用户“请选择一个选项”，并返回`false`，阻止表单提交。 ```html <script> function checkform(obj) { for (i = 0; i < obj.oo.length; i++) { if (obj.oo[i].checked == true) return true; } alert("请选择一个选项"); return false; } </script> <form id="form1" name="form1" method="post" action="" onsubmit="return checkform(this)"> <input type="radio" name="oo" value="radiobutton"/> <input type="radio" name="oo" value="radiobutton"/> <input type="submit" name="Submit" value="提交"/> </form> ``` 2. 文本区域长度限制函数`test()`： 此函数用于验证文本区域（textarea）内的字符数是否超过了50个。如果超过，则弹出警告提示用户“字符数不能超过50个”，并聚焦到该文本区域，使用户可以方便地进行修改。函数返回`false`阻止表单提交。 ```html <script> function test() { if (document.a.b.value.length > 50) { alert("字符数不能超过50个"); document.a.b.focus(); return false; } } </script> <form name="a" onsubmit="return test()"> <textarea name="b" cols="40" wrap="VIRTUAL" rows="6"></textarea> <input type="submit" name="Submit" value="检查"> </form> ``` 3. 只允许输入中文的输入框： 此输入框通过`onkeyup`事件监听用户输入，并使用正则表达式`/[\u4E00-\u9FA5]/g`来检查输入的字符是否为中文。如果不是中文，自动替换为空字符串，从而只允许输入中文字符。 ```html <input onkeyup="this.value = this.value.replace(/[^\u4E00-\u9FA5]/g, '')"> ``` 4. 只允许输入英文的输入框： 这个输入框通过`onkeydown`事件，当用户按下键盘键时，检查按键的`keyCode`值是否在大写字母A-Z的范围内（65-90）。如果不是，则设置`event.returnValue`为`false`，阻止默认的键入行为，实现只允许输入英文字符的功能。 ```html <script language="javascript"> function onlyEng() { if (!(event.keyCode >= 65 && event.keyCode <= 90)) { event.returnValue = false; } } </script> <input onkeydown="onlyEng();"> ``` 5. 只允许输入数字的输入框： 类似地，`onlyNum()`函数用于确保输入的字符只包含数字。它检查`keyCode`值是否在0-9的范围内（48-57），如果不是，则阻止输入。 ```html <script language="javascript"> function onlyNum() { if (!((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105))) { event.returnValue = false; } } </script> <input onkeydown="onlyNum();"> ``` 这些函数在实际开发中非常实用，可以根据需求组合或自定义以满足各种验证场景。了解并掌握这些验证技术，可以提高表单数据的质量，减少服务器端处理错误数据的压力，提升用户体验。