javascript - 多页、动态内容 JS

Question

我想创建一个用于更改页面的按钮。我的问题是，我有一个我以前写的代码，但它不是我想要的那样工作。

代码如下:

function loadingPage() {

    $(function () {
        $(".content").load("home.html");
    });

}

function loadingPage_about() {

    $(function () {
        $(".content").load("about.html");
    });

}

button1.onclick = loadingPage;
button2.onclick = loadingPage_about;

我想使用一个函数来削减这段代码，然后在属性中更改页面。像这样:

function loadingPage(page) {

    $(function () {
        $(".content").load(page);
    });

}

button1.onclick = loadingPage("home.html");
button2.onclick = loadingPage("about.html");

但它不起作用，页面在 window.onload 之后自动加载并且按钮不会更改内容部分。有人能告诉我为什么这段代码不起作用吗？ :/

Answer 1

这里，立即执行loadingPage并将结果赋值给button.onclick:

button1.onclick = loadingPage("home.html");

要延迟执行，您可以例如将其包装在一个函数中:

button1.onclick = function() {loadingPage("home.html")};