简体   繁体   中英

Unable to redirect to page using window.location

I'm not able to redirect to a single page using windows location in .js page.

However I checked with alert box to see whether the condition is passing true or not and it is working while location is not working.

var attempt = 3; // Variable to count number of attempts.
// Below function Executes on click of login button.
function validate() {
    var email = document.getElementById("email").value;
    var password = document.getElementById("password").value;
    if (email == "test1@gmail.com" && password == "test1") {
        alert("Login successfully");
        window.location.href = 'messages.php';
        return false;
    } else {
        attempt--; // Decrementing by one.
        alert("You have left " + attempt + " attempt;");
        // Disabling fields after 3 attempts.
        if (attempt == 0) {
            document.getElementById("email").disabled = true;
            document.getElementById("password").disabled = true;
            document.getElementById("submit").disabled = true;
            return false;
        }
    }
}

I feel I'm missing something.

I suspect you're calling validate like this:

<form onsubmit="validate()" ...>

That won't use the return value of validate to cancel the submit. You need a return :

<form onsubmit="return validate()" ...>

Since the submission is not being cancelled, the form submission is a navigation action, which overrides your assignment to window.location.href .

In a comment you've said you're doing this:

<button type="submit" name="submit" onclick="validate()" class="btn-secondary">Sign In</button>

If so, adding the return to the onclick should fix it on any modern browser:

<button type="submit" name="submit" onclick="return validate()" class="btn-secondary">Sign In</button>

But I would move it to an onsubmit on the form instead.


Side note: There's no need for the type="submit" on that button. submit is the default type for button elements.

var attempt = 3; // Variable to count number of attempts.
// Below function Executes on click of login button.
function validate() {
    var email = document.getElementById("email").value;
    var password = document.getElementById("password").value;
    if (email == "test1@gmail.com" && password == "test1") {
        alert("Login successfully");
        window.location.href = 'messages.php';
        return false;
    } else {
        attempt--; // Decrementing by one.
        alert("You have left " + attempt + " attempt;");
        // Disabling fields after 3 attempts.
        if (attempt == 0) {
            document.getElementById("email").disabled = true;
            document.getElementById("password").disabled = true;
            document.getElementById("submit").disabled = true;
        }
        return false; // ALWAYS return this. else it will proceed with page submit.
    }
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM