不重定向到页面

Question

I am trying to redirect to a page if login credentials are correct. but its not working. how do you redirect a page and avoid page refresh on submit if credentials are wrong. It redirects when i dont fill the form and submit it. but not when i fill the form.

 var db = window.localStorage; function login(){ var loginFormDt = document.querySelector('#login-form'); var logEmail = loginFormDt.querySelector('input[type="email"]'); var logPass = loginFormDt.querySelector('input[type="password"]'); if(db.email == logEmail.value && db.password == logPass.value){ window.location.replace = 'http://www.google.com'; }else{ window.location.replace = 'http://www.bing.com' } } function signUp () { var signupFormDt = document.querySelector('#signup-form'); var email = signupFormDt.querySelector('input[name="email"]'); var password = signupFormDt.querySelector('input[name="password"]'); var userName = signupFormDt.querySelector('input[name="name"]'); db.setItem(userName.name, userName.value); db.setItem(email.name, email.value); db.setItem(password.name, password.value); } 

 <section> <h3>login Page</h3> <div id="login"> <p><a href="../html/index.html" title="link to home page">Myselfie Tech</a></p> <form method="Post" id="login-form"> <p> <input type="email" name="email" id="email" placeholder="email" required> </p> <p> <input type="password" name="password" id="password" placeholder="password" required> </p> <p> <button type="submit" onclick="login()">Submit Query</button> </p> <p> <button onclick="window.location='../html/index.html'">Back</button> </p> </form> </div> </section> 

Answer 1

Try window.location = "some-url" or window.location.href = "some-url" . replace is a string method , not a property of location .

Answer 2

When you add button inside form, you have to write onsubmit event, not onclick on button. Because you are submitting a form. And if you dont want form submission then set button type="button". So you can add onclick event and form won't be submitted on click.

1. To prevent page reload on submit. You can use event.preventDefault() or return false.

2. Page redirect you use window.location.href = or window.location.replace();

   login Page

   Myselfie Tech

   Submit Query

   Back

    <script> var db = window.localStorage; function login(e) { console.log(e); e.preventDefault(); window.location.href='https://www.google.com'; var loginFormDt = document.querySelector('#login-form'); var logEmail = loginFormDt.querySelector('input[type="email"]'); var logPass = loginFormDt.querySelector('input[type="password"]'); if(db.email == logEmail.value && db.password == logPass.value){ window.location.replace('http://www.google.com'); }else{ window.location.replace('http://www.bing.com') } } function signUp () { var signupFormDt = document.querySelector('#signup-form'); var email = signupFormDt.querySelector('input[name="email"]'); var password = signupFormDt.querySelector('input[name="password"]'); var userName = signupFormDt.querySelector('input[name="name"]'); db.setItem(userName.name, userName.value); db.setItem(email.name, email.value); db.setItem(password.name, password.value); } </script> 

Answer 3

You can use:

window.location.replace("http://stackoverflow.com");

or:

window.location.href = "http://stackoverflow.com";

Answer 4

The replace() method searches a string for a specified value, or a regular expression, and returns a new string where the specified values are replaced.

window.location = 'http://www.bing.com';

or

window.location.href = 'http://www.bing.com';

or try

location.href = 'http://www.bing.com';

check this demo code

 function login() { window.location.href = 'https://stackoverflow.com/'; } 

 <section> <h3>login Page</h3> <div id="login"> <p><a href="../html/index.html" title="link to home page">Myselfie Tech</a></p> <form method="Post" id="login-form"> <p> <input type="email" name="email" id="email" placeholder="email" required> </p> <p> <input type="password" name="password" id="password" placeholder="password" required> </p> <p> <button type="submit" onclick="login()">Submit Query</button> </p> <p> <button onclick="window.location='../html/index.html'">Back</button> </p> </form> </div> </section> 

for more information

https://www.w3schools.com/jsref/jsref_replace.asp