仅当在上一页上单击按钮时才重定向

Question

我试图仅在单击上一页上的按钮时实现重定向。我是 JS 新手，所以请保持温柔。

例如：
当用户进入登录页面时，他们有这个按钮：

<button type="submit" class="form-login-submit" name="login" value="Log in">Log in</button>

当您单击“登录”按钮时，您将被重定向到“我的帐户”页面，其中包含 class member-logged-in body。

所以，这是我的代码：

const logInBtn = document.querySelector('.form-login-submit');

logInBtn.addEventListener('click', () => {
  window.onload = () => document.body.classList.contains('member-logged-in') ? window.location.href = 'www.test.com' : '';
});

但是当用户被重定向到“我的帐户”页面时出现此错误，我想是因为该页面上缺少“登录”按钮：

Uncaught TypeError: Cannot read property 'addEventListener' of null at (index):691

感谢任何帮助。

Answer 1

只保留 window.onload = () => document.body.classList.contains('member-logged-in') ? window.location.href = 'www.test.com' : ''; 部分代码。

假设您已经具备一些功能，如果单击按钮，它会将 class 添加到 body 元素。

Answer 2

const logInBtn = document.querySelector('.form-login-submit');

logInBtn.addEventListener('click', () => {
  //window.onload = () => document.body.classList.contains('member-logged-in') ? window.location.href = 'www.test.com' : '';
});

window.onload = () => {
    var logInBtn = document.querySelector('.form-login-submit');
    logInBtn.addEventListener('click', () => {
        var el = document.querySelector('.any-element');
        if(el.classList.contains('member-logged-in')){
            window.location.href = 'www.test.com?click=true';
            / Now it's clear on the server that there was a click from the previous page
        } 
    }
}

Answer 3

您正在项目中使用 Vanilla Javascript，并且在您的帐户页面上加载了相同的脚本。为您的 addEventListener 添加一个 if 检查，您就完成了。

const logInBtn = document.querySelector('.form-login-submit');

if(logInBtn) {
  logInBtn.addEventListener('click', () => {
    window.onload = () => document.body.classList.contains('member-logged-in') ? window.location.href = 'www.test.com' : '';
  });
}

Answer 4

您可以使用 localStorage 解决此问题。也许这是肮脏的解决方案，但它会起作用。

const logInBtn = document.querySelector('.form-login-submit');
const isPage = window.document.href = 'https://test.com/my-account/';

logInBtn ? logInBtn.addEventListener('click', () => localStorage.setItem('justLogin', 1)) : 0;

if (isPage == 'https://test.com/my-account/' && localStorage.getItem('justLogin') && document.body.classList.contains('member-logged-in')) {
    localStorage.removeItem('justLogin');
    window.location.href = 'https://test.com/members/';
}

仅当在上一页上单击按钮时才重定向

Redirection only if the button is clicked on the previous page

javascript

dom-events