登录后跳转if/else逻辑中window.location.replace不生效问题求助

登录重定向失效问题修复方案 #

核心根因 #

你使用了type="submit"的提交按钮，点击后会默认触发表单提交的原生行为，页面会优先执行表单的刷新/跳转逻辑，直接中断了你写的window.location.replace重定向代码执行。
除此之外还存在两处代码错误也会导致逻辑不生效：

• 密码变量名拼写错误：代码中写的passowrd应为password，会导致账号密码校验永远不通过，无法进入重定向分支
• action属性使用错误：action是表单专属属性，写在div标签上完全无效

具体修复步骤 #

步骤1：修改事件绑定逻辑，阻止表单默认提交

修改按钮的onclick属性，加上return关键字承接validate函数的返回值，用来控制是否阻止表单默认提交：

<input type="submit" value="Login" id="login-submit" onclick="return validate()">

步骤2：修正JS代码的拼写错误和返回逻辑

function validate(){
    var username = document.getElementById('login-username').value;
    // 修正密码变量名拼写
    var password = document.getElementById('login-password').value;

    if (username === "daksh" && password === 'daksh'){
        alert('You have sucessfully logged in');
        // 替换为你实际要跳转的站内页面地址
        window.location.replace("你的目标页面地址");
        // 新增返回false，阻止表单默认提交行为
        return false;
    } else{
        alert('Wrong username or password');
        return true;
    }
}

可选简化方案

如果你不需要用到表单原生提交能力，可以直接把按钮的类型改成普通按钮，直接去掉默认提交行为，不需要额外加返回值控制：

<input type="button" value="Login" id="login-submit" onclick="validate()">

内容的提问来源于stack exchange，提问作者Daksh Sharma