尝试使用 JS 在我的页面上运行重定向。我究竟做错了什么？ [复制]答案

【问题标题】：Trying to use JS to run redirects on my page. What am I doing wrong? [duplicate]尝试使用 JS 在我的页面上运行重定向。我究竟做错了什么？ [复制]
【发布时间】：2020-04-14 06:24:04
【问题描述】：

我的页面应该从我网站的根页面重定向到两个不同的子页面之一，通过根页面上的按钮链接。按钮不起作用。

这是我的代码：

HTML：

<!DOCTYPE html>
<html>
  <head>
    <title>My name</title>
    <link rel="stylesheet" href="styles.css">
    <script src="js.js"></script>
  </head>
  <body>
    <div class="navbar">
      <input type="button" class="button" value="My GitHub portfolio" onclick="page1();">
      <br>
      <input type="button" class="button" value="Start Page" onclick="page2();">
    </div>
  </body>
</html>

JS：

var pageto;

function page1(){
    var pageto = 1;
    reload();
};

function page2(){
    var pageto = 2;
    reload();
};

function reload(){
    if (pageto == 1){
        location.href('personal-website');
    }
    else if (pageto == 2){
        location.href('start-gp');
    };
};

【问题讨论】：

您能否扩展一下“按钮不起作用”？控制台中的任何错误？一方面，href 不是一种方法；参见例如developer.mozilla.org/en-US/docs/Web/API/Location.

标签： javascript html

【解决方案1】：

function redirect(el){
    location.href = el.getAttribute("data-url");
}

<input type="button" class="button" value="My GitHub portfolio" onclick="redirect(this)" data-url="personal-website">
<br>
<input type="button" class="button" value="Start Page" onclick="redirect(this)" data-url="start-gp">

【讨论】：

【解决方案2】：

第一个问题是，您在page1 和page2 中重新声明了pageto 变量，因此reload 函数无法访问它。

可以在赋值前去掉var关键字，设置全局（不推荐）：

var pageto;
function page1(){
    pageto = 1;
    reload();
};

function page2(){
    pageto = 2;
    reload();
};

或者，将其作为参数传递给reload。这样可以避免创建不必要的变量：

function page1(){
    reload(1);
};

function page2(){
    reload(2);
};
function reload(pageto){
  //Contents of reload function
};

第二个问题是location.href属性包含页面的URL，它不是一个函数。您可以通过为其分配新 URL 来重定向页面：

function reload(){
    if (pageto == 1){
        location.href='personal-website';
    }
    else if (pageto == 2){
        location.href='start-gp';
    };
};

或者，您可以使用window.open 方法来重定向浏览器：

function reload(){
    if (pageto == 1){
        window.open('personal-website','_self');
    }
    else if (pageto == 2){
        window.open('start-gp','_self');
    };
};

或者类似的location.replace：

function reload(){
    if (pageto == 1){
        location.replace('personal-website','_self');
    }
    else if (pageto == 2){
        location.replace('start-gp','_self');
    };
};

【讨论】：