步骤：
1. 先在form表单上添加 onsubmit 事件（该事件返回true则会提交到服务器，返回false则拒绝提交）
2. 找到要验证的那个input的节点（使用id也行，用name名也行，案例是查找的name名）
3. 编写onsubmit事件return的方法（判断另外那个正则函数验证返回的是true还是false）
4. 正则验证写一个函数，并且return一个true,或者false 方便第三步判断使用
案例代码：
<body> <!-- onsubmit事件是在表达被提交时触发 --> <form action="index.php" method="post" onsubmit="return checkUser()"> <input type="text" name="username" value=""><span id="msg"></span><br> <input type="submit" name="" value="提交"> </form> <script type="text/javascript"> var oUserName = document.getElementsByName(‘username‘)[0]; var oMsg = document.getElementById(‘msg‘);//显示信息的 function checkUser(){ var res = jcUser(); if (res == true) { return true; }else{ return false; } } function jcUser(){ var reg = /^[a-z]\w{5,19}$/;//用户名规则是6-20位 小写字母开头 var result = reg.test(oUserName.value); if (result) { oMsg.innerHTML = ‘<font color="greeg">用户名可以使用</font>‘; return true; }else{ oMsg.innerHTML = ‘<font color="red">用户名不合法</font>‘; return false; } } </script> </body>
原文：https://www.cnblogs.com/qiu1990/p/14320683.html