jQuery表单验证之密码确认
众所周知,在修改密码时会需要两次输⼊密码。这时如何确保两个密码框中都有内容?两个密码框中是⼀致的?如果⼀个没有输⼊会给出提⽰?OK这⼀切都可以⽤JS来实现,具体思想很简单啦,就是编写事件获取dom节点,判断对象的取值呀?
那么编写什么事件?应该是onblur事件~。⽽且要为两个密码框都加上失去焦点的blur事件。利⽤jQuery⽐较⽅便勒。
话不多说,直接上代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>password验证</title>
<script src="jquery/jquery-3.1.1.min.js" type="text/javascript"></script>
</head>
<body>
<form ation="psot" method="">
<label for="password1">请输⼊密码:</label>
<input id="password" name="password" onblur="checkpas1();" required="true" type="password"/>
<br/>
<label for="password1">请确认密码:</label>
<input type="password" name="repassword" id="repassword" required="true" onChange="checkpas();" />
<span class="tip" >两次输⼊的密码不⼀致</span><br>
<input type="button" name="submit" value="提交" onclick="checkpas2();"/>
</form>
<script>
$(".tip").hide();
function checkpas1(){//当第⼀个密码框失去焦点时,触发checkpas1事件
var ElementById("password").value;
var ElementById("repassword").value;//获取两个密码框的值
if(pas1!=pas2&&pas2!="")//此事件当两个密码不相等且第⼆个密码是空的时候会显⽰错误信息
$(".tip").show();
else
$(".tip").hide();//若两次输⼊的密码相等且都不为空时,不显⽰错误信息。
}
function checkpas(){//当第⼀个密码框失去焦点时,触发checkpas2件
var ElementById("password").value;
var ElementById("repassword").value;//获取两个密码框的值
if(pas1!=pas2){
$(".tip").show();//当两个密码不相等时则显⽰错误信息
}else{
$(".tip").hide();
}
}
function checkpas2(){//点击提交按钮时,触发checkpas2事件,会进⾏弹框提醒以防⽆视错误信息提交
var ElementById("password").value;
var ElementById("repassword").value;
jquery怎么进行验证if(pas3!=pas4){
alert("两次输⼊的密码不⼀致!");
return false;
}
}
</script>
</body>
</html>
</html>
希望⼤家能去理解代码,其实还是⽐较简单的,多写写就会了。我也是才上⼿的。说的不对的,希望⼤佬指出来
以上就是本⽂的全部内容,希望对⼤家的学习有所帮助,也希望⼤家多多⽀持。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。