这篇文章给大家分享的是有关javascript表单是否为空的验证方法有哪些的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。
表单验证
拿到表单内容进行非空验证（单独函数封装，方便后面调用）
为空则向P里面加内容
要阻断表单提交，不然直接跳走了
e.preventDefault()提交时要判定是否为空
键值提交也要判定是否为空
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>div { width: 600px; height: 600px; margin: 50px auto; background-color: skyblue; padding: 20px;}div input { width: 520px; height: 50px; margin-top: 50px;} </style></head><body><div><form action=""> <input type="text" name="name" placeholder="输入用户名"><br> <p class="nameTip"></p> <input type="password" name="password" placeholder="输入密码"><br> <p class="passwordTip"></p> <input type="submit" name="submit" value="按钮"></form></div> <script>var formEle = document.querySelector('form')var nameinput = document.querySelector('input[name="name"]')var passwordinput = document.querySelector('input[name="password"]')var pnameTip = document.querySelector('.nameTip')var ppasswordTip = document.querySelector('.passwordTip')//是否为空判定function checkUserNameNull(){ if(nameinput.value==''){ pnameTip.innerHTML='输入名字' return false }else{ pnameTip.innerHTML='' return true }}//失去焦点进行用户名是否为空验证 nameinput.οnblur=function (){ checkUserNameNull() }//是否为空判定function checkPasswordNull(){ if(passwordinput.value==''){ ppasswordTip.innerHTML='输入名字' return false }else{ ppasswordTip.innerHTML='' return true }}//失去焦点进行密码框是否为空验证 passwordinput.οnblur=function (){ checkPasswordNull() }//提交时验证formEle.onsubmit = function (e) { e.preventDefault() //阻止表单默认提交 var nameisok=checkUserNameNull() var passwordisok= checkPasswordNull()//都满足不为空提交 if(nameisok && passwordisok){ location.href = 'https://www.baidu.com/' }}//键值提交document.οnkeyup=function (e){ var keyCode=e.keyCode|| e.which if(keyCode==13&&e.shiftKey){ var nameisok=checkUserNameNull() var passwordisok= checkPasswordNull() if(nameisok && passwordisok){ location.href = 'https://www.baidu.com/' } }} </script></body></html>感谢各位的阅读！关于“javascript表单是否为空的验证方法有哪些”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！
