js验证表单大全 有挺多的

根据提供的文件信息，我们可以归纳总结出一系列JavaScript在表单验证中的应用案例，这些案例涵盖了不同类型的验证需求，从文本长度到特定字符集过滤等。接下来将详细解释这些示例背后的技术原理及其应用场景。 ### 一、文本长度限制 **代码示例**： ```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="check"> </form> ``` **解析**：该示例演示了如何限制用户输入的文本长度不超过50个字符。`test()`函数通过判断`textarea`控件中内容的长度是否超过50来决定是否阻止表单提交。如果超出，则弹出提示并取消提交，同时使输入焦点回到`textarea`上。 ### 二、仅允许中文输入 **代码示例**： ```html <input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')"> ``` **解析**：这段代码利用正则表达式`/[^\u4E00-\u9FA5]/g`来匹配非中文字符，并将其替换为空字符串，从而实现了只允许输入中文的效果。 ### 三、仅允许英文输入 **代码示例**： ```html <script language="javascript"> function onlyEng() { if (!(event.keyCode >= 65 && event.keyCode <= 90)) { event.returnValue = false; } } </script> <input onkeydown="onlyEng();"> ``` **解析**：通过检测键盘事件的`keyCode`值，判断用户输入的是不是英文字母（大写A至Z的`keyCode`值分别为65至90），如果不是，则阻止输入。 ### 四、仅允许数字输入 **代码示例**： ```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();"> ``` **解析**：与仅允许英文输入类似，这里通过检测`keyCode`值来判断用户输入的是不是数字（0-9的`keyCode`值分别为48至57，小键盘上的0-9为96至105），如果不是，则阻止输入。 ### 五、仅允许数字输入（增强版） **代码示例**： ```html <input onkeyup="value=value.replace(/[\W]/g,'')" onbeforepaste="clipboardData.setData('text', clipboardData.getData('text').replace(/[^\d]/g,''))"> ``` **解析**：这个示例不仅检查了键盘输入，还考虑了复制粘贴的情况，通过正则表达式`/[\W]/g`匹配所有非字母数字字符，并将其替换为空字符串，从而确保了输入的纯粹性。 ### 六、电子邮件格式验证 **代码示例**： ```html <script LANGUAGE="javascript" RUNAT="Server"> function isEmail(strEmail) { if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1) return true; else alert("邮箱格式不正确"); } </script> <input type="text" onblur="isEmail(this.value)"> ``` **解析**：使用正则表达式来验证电子邮件地址的格式是否符合标准。如果不符合，则弹出提示。 ### 七、密码前缀验证 **代码示例**： ```html <script language="javascript1.2"> function test() { if ((a.b.value.indexOf("***") == 0) || (a.b.value.indexOf("****") == 0)) { alert("密码不允许以***或****开头"); a.b.focus(); return false; } } </script> <form name="a" onsubmit="return test()"> <input type="text" name="b"> <input type="submit" name="Submit" value="check"> </form> ``` **解析**：该函数用于验证密码输入框中的内容是否以“***”或“****”开头。如果是，则弹出提示并取消提交，同时使焦点回到输入框。 ### 八、密码一致性验证 **代码示例**： ```html <FORM METHOD="POST" ACTION=""> <input type="password" id="input1"> <input type="password" id="input2"> <input type="button" value="test" onclick="check()"> </FORM> <script> function check() { with (document.all) { if (input1.value != input2.value) { alert("两次输入的密码不一致"); input1.value = ""; input2.value = ""; } else { document.forms[0].submit(); } } } </script> ``` **解析**：此示例展示了如何比较两个密码输入框中的内容是否相同。如果不一致，则弹出提示并清空两个输入框；如果一致，则提交表单。 ### 结论 以上示例涵盖了多种常见的表单验证场景，包括但不限于文本长度限制、特定字符集过滤、格式验证等。通过这些代码片段，开发者可以快速实现各种表单验证逻辑，提高用户体验的同时确保数据的有效性和安全性。