window.location.href 未重定向到另一个页面？#

Question

当我按下注册按钮时，它会存储数据并执行除重定向到其他页面之外的所有操作，而是在我的浏览器路径中给出

?#

我已经尝试了一切，包括

window.location.replace()

我的main2.html位于同一个文件夹中 我认为出现在路径末尾的

?#

导致了这个问题

function login() {
  let password = document.querySelector(".password").value;
  let email = document.querySelector(".email").value;
  let user_records = new Array()
  user_records = JSON.parse(localStorage.getItem("users")) ? JSON.parse(localStorage.getItem("users")) : []
  if (user_records.some((v) => {
      return v.email == email && v.password == password
    })) {
    let currrent_user = user_records.filter((v) => {
      return v.email == email && v.password == password
    })[0]
    localStorage.setItem("email", currrent_user.email)
    localStorage.setItem("password", currrent_user.password)
    localStorage.setItem('isLoggedIn', true)
    localStorage.setItem("name", currrent_user.firstName);
    localStorage.setItem("phone", currrent_user.phone)
    window.location.href = "/main2.html"
    //not wwrking 
  } else {
    alert("login failed")
    localStorage.setItem('isLoggedIn', false)
  }
}
// signup function
function saveData() {
  let username = document.querySelector(".username").value;
  let password = document.querySelector(".password").value;
  let email = document.querySelector(".email").value;
  let phoneNo = document.querySelector(".phone").value;
  let firstname = document.querySelector(`.firstname`).value;
  let user_records = new Array()
  user_records = JSON.parse(localStorage.getItem("users")) ? JSON.parse(localStorage.getItem("users")) : []
  if (user_records.some(record => record.email === email))
    alert("User already exists,please login")
  else if (user_records.some(record => record.username === username)) {
    alert('Username has been taken')
  } else {
    user_records.push({
      "firstName": firstname,
      "username": username,
      "email": email,
      "password": password,
      "phone": phoneNo
    })
    localStorage.setItem("users", JSON.stringify(user_records)); // Save updated user_records array
  }
}

//html code div class="wrapper">
<form action="#">
  <h1>Login</h1>
  <div class="input_box">
    <input type="text" placeholder="email" class="email" required />
  </div>
  <br>
  <div class="input_box">
    <input type="password" placeholder="Password" class="password" required />
  </div><br>
  <button type="submit" onclick="login()" class="btn">Login</button>
  <div class="Sign-Up">
    <p>
      Don't have an account yet? Sign up here :
      <a href="" class="link">Sign Up</a>
    </p>
  </div>
</form>

Answer 1

• 使用表单提交 - 现在您将表单提交到“#”
• 注册时也停止链接
• 两者都可以通过 PreventDefault 来做到这一点

window.addEventListener('DOMContentLoaded', () => {
  document.getElementById('loginForm').addEventListener('submit', (e) => {
    e.preventDefault(); // alternatively change form method to get and action to "/main2.html"
    let password = document.querySelector(".password").value;
    let email = document.querySelector(".email").value;
    let user_records = user_records = JSON.parse(localStorage.getItem("users") || `[]`);
    if (user_records.some((v) => {
        return v.email == email && v.password == password
      })) {
      let currrent_user = user_records.filter((v) => {
        return v.email == email && v.password == password
      })[0]
      localStorage.setItem("email", currrent_user.email)
      localStorage.setItem("password", currrent_user.password)
      localStorage.setItem('isLoggedIn', true)
      localStorage.setItem("name", currrent_user.firstName);
      localStorage.setItem("phone", currrent_user.phone)
      window.location.href = "/main2.html";
    } else {
      alert("login failed")
      localStorage.setItem('isLoggedIn', false)
    }
  })
  // signup function
  document.querySelector('.link').addEventListener('click', (e) => {
    e.preventDefault(); // stop link
    let username = document.querySelector(".username").value;
    let password = document.querySelector(".password").value;
    let email = document.querySelector(".email").value;
    let phoneNo = document.querySelector(".phone").value;
    let firstname = document.querySelector(`.firstname`).value;
    let user_records = new Array()
    user_records = JSON.parse(localStorage.getItem("users")) ? JSON.parse(localStorage.getItem("users")) : []
    if (user_records.some(record => record.email === email))
      alert("User already exists,please login")
    else if (user_records.some(record => record.username === username)) {
      alert('Username has been taken')
    } else {
      user_records.push({
        "firstName": firstname,
        "username": username,
        "email": email,
        "password": password,
        "phone": phoneNo
      })
      localStorage.setItem("users", JSON.stringify(user_records)); // Save updated user_records array
    }
  });
});

<form action="#" id="loginForm">
  <h1>Login</h1>
  <div class="input_box">
    <input type="text" placeholder="email" class="email" required />
  </div>
  <br>
  <div class="input_box">
    <input type="password" placeholder="Password" class="password" required />
  </div><br>
  <button type="submit" class="btn">Login</button>
  <div class="Sign-Up">
    <p>
      Don't have an account yet? Sign up here :
      <a href="#" class="link">Sign Up</a>
    </p>
  </div>
</form>