Shulou(Shulou.com)06/01 Report--

This article is about javascript form is empty validation methods to share what content. Xiaobian thinks it is quite practical, so share it with everyone for reference. Let's follow Xiaobian and have a look.

form validation

拿到表单内容进行非空验证（单独函数封装，方便后面调用）

为空则向P里面加内容

要阻断表单提交，不然直接跳走了e.preventDefault()

提交时要判定是否为空

键值提交也要判定是否为空

Document div { width: 600px; height: 600px; margin: 50px auto; background-color: skyblue; padding: 20px;}div input { width: 520px; height: 50px; margin-top: 50px;}

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[xss_clean]='输入名字' return false }else{ pnameTip[xss_clean]='' return true }}//失去焦点进行用户名是否为空验证 nameinput.οnblur=function (){ checkUserNameNull() }//是否为空判定function checkPasswordNull(){ if(passwordinput.value==''){ ppasswordTip[xss_clean]='输入名字' return false }else{ ppasswordTip[xss_clean]='' 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/' } }} 感谢各位的阅读!关于"javascript表单是否为空的验证方法有哪些"这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.