javascript错误中的密码和确认密码验证？

var password=document.getElementById（“密码”）；
var confirm_password=document.getElementById（“confirm_password”）；
函数validatePassword（）
{
if（password.value！=确认密码.value）
{
确认_password.setCustomValidity（“密码不匹配”）；
} 
else if（password.value==''）
{
password.setCustomValidity（“密码不能为空”）；
} 
其他的
{
密码。setCustomValidity（“”）；
}
}
password.onchange=validatePassword；
确认\u password.onkeyup=validatePassword
尝试这样使用，使用
|
（或）条件

<input type="password" name="password" id="password" placeholder="Please Enter Password" required="required"/>
<input type="password" name="confirm_password" id="confirm_password" placeholder="Confirm Password"  required="required"/>

<script>
    var password = document.getElementById("password");
    var confirm_password = document.getElementById("confirm_password");

function validatePassword()
{
    if(password.value != confirm_password.value)
    {
        confirm_password.setCustomValidity("Passwords Don't Match");
    } 
    else if(password.value == '' || password.value == undefined || password.value == null)
    {
        password.setCustomValidity("Passwords must not be empty");
    } 
    else
    {
        password.setCustomValidity('');
    }
}
password.onchange = validatePassword;
confirm_password.onkeyup = validatePassword;
</script>


var password=document.getElementById（“密码”）；
var confirm_password=document.getElementById（“confirm_password”）；
函数validatePassword（）
{
if（password.value！=确认密码.value）
{
确认_password.setCustomValidity（“密码不匹配”）；
} 
else if（password.value=''|| password.value==未定义|| password.value==null）
{
password.setCustomValidity（“密码不能为空”）；
} 
其他的
{
密码。setCustomValidity（“”）；
}
}
password.onchange=validatePassword；
确认\u password.onkeyup=validatePassword；
您必须使用
.reportValidity（）
，因为警告将实际显示


var password=document.getElementById（“密码”）；
var confirm_password=document.getElementById（“confirm_password”）；
函数validatePassword（）
{
if（password.value！=确认密码.value）
{
确认_password.setCustomValidity（“密码不匹配”）；
确认_password.reportValidity（）；
} 
else if（password.value.trim（）==“”）
{
password.setCustomValidity（“密码不能为空”）；
password.reportValidity（）；
}否则
{
密码。setCustomValidity（“”）；
}
}
password.onchange=validatePassword；
确认\u password.onkeyup=validatePassword
它必须按此顺序。
首先检查空值。试试这个

    if(password.value=="")
    {
        password.setCustomValidity("Passwords must not be empty");
    } 
    else if(password.value != confirm_password.value)
    {
        confirm_password.setCustomValidity("Passwords Don't Match");
    } 
    else
    {
        password.setCustomValidity('');
    }

由于您没有在
标记中设置
setCustomValidity（）
内联，因此您甚至可以删除
required
属性，并将所有验证留给JS脚本（只需确保正确处理
提交事件，例如使用
e.preventDefault（）
）。这是为了避免触发默认验证。其次，在您的逻辑中，
password.setCustomValidity（“”）都不会重置

因此，为了安全起见，请尝试以下方法：

删除
required
属性并添加
oninput
属性：

<input type="password" name="password" id="password" placeholder="Please Enter Password" oninput="this.setCustomValidity('')" />

请注意，如果不更改逻辑顺序，则无论何时只要
确认\u密码
有值，
都无法触发
“密码不得为空”
，尽管它仍然会触发
不匹配
错误。只有当两者都为空时它才起作用，否则如果（password.value=''| | | password.value==null）也请注意，在大多数现代浏览器上使用必需的属性将覆盖此验证。可能重复
function validatePassword()
{
    if(password.value.trim() == "")
    {
        password.setCustomValidity("Passwords must not be empty");
        password.reportValidity();
    } 
    else if(password.value != confirm_password.value)
    {
        confirm_password.setCustomValidity("Passwords Don't Match");
        confirm_password.reportValidity();
    }; /* else
    {
        password.setCustomValidity("");
    } */
}