jQuery表单密码强度验证问题：两个校验条件无法同时生效

兄弟，我猜你大概率踩了两个坑：变量获取错误和逻辑分支覆盖！先看你代码里的一个明显小疏漏——你用document.getElementById('fullname').value拿的是用户名输入框的值，不是密码框的！这直接导致第一个校验逻辑完全错位，先把这个低级错误补上再说。

再来说核心问题：如果你的代码里用了if...else if...的结构，或者在第一个条件里加了return，那只要第一个条件触发，第二个条件就永远不会执行。要让两个校验条件同时生效且各自返回不同提示，得用独立的判断逻辑，或者先收集所有错误再统一输出。

给你整理了修正后的代码，直接用就行：

<script>
// 密码校验：空值检查 + 强度检查
jQuery("#password").blur(function() {
    // 重点：获取密码框的值，不是fullname！
    var password = document.getElementById('password').value; 
    var errorMsg = '';
    var isValid = true;

    // 第一个条件：空值校验
    if (!password.trim()) {
        errorMsg += '密码不能为空！';
        isValid = false;
    }

    // 第二个条件：强度校验（这里用了通用的强密码规则，你可以自己调整）
    var strongPwdRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{8,}$/;
    // 注意：这里加了password.trim()判断，避免空值时重复触发强度校验提示
    if (password.trim() && !strongPwdRegex.test(password)) {
        if (errorMsg) errorMsg += '<br>'; // 已有错误时换行分隔
        errorMsg += '密码强度不足！需至少8位，包含大小写字母和数字';
        isValid = false;
    }

    // 假设你有个id为passwordError的元素用来显示错误提示
    if (!isValid) {
        jQuery('#passwordError').html(errorMsg).show();
    } else {
        jQuery('#passwordError').hide();
    }
});
</script>

关键逻辑说明： #

• 修正了变量获取错误，确保拿到的是密码输入框的值
• 用两个独立的if判断，两个条件会被依次检查，不会互相覆盖
• 收集所有错误信息，最后统一展示，空值和强度不足的提示可以同时显示（如果两个条件都不满足）
• 如果你的需求是“空值时只提示空值，非空但强度不够时只提示强度”，这个逻辑也完全适配

另外，如果你的原始代码是在第一个条件里加了return，比如：

// 错误示例：return会阻断后续代码执行
if (!password) {
    alert('密码不能为空');
    return; // 这里return后，后面的强度校验永远不会跑
}

这种情况直接去掉return，换成收集错误的方式就解决了。

内容的提问来源于stack exchange，提问作者Rana Pratap