Chrome扩展程序：使用JavaScript在扩展程序内导航

Question

我正在编写一个简单的Chrome扩展程序，其中包含一个列表和一个添加按钮。

点击“添加”按钮后，用户将进入扩展程序内部的一个新HTML页面，并显示表单。

表单页面上有一个“返回”按钮，需要将用户带回到列表页面。

如何从扩展程序的第二个页面导航回扩展程序的第一个页面？

编辑：

扩展程序中的历史对象是浏览器的历史对象，而不是扩展程序的历史对象。我需要在扩展程序内部返回。

示例图像以显示扩展程序的两个页面：

- Anand

Answer 1

试试这个：

document.write('<a href="popup.html"><button class="button">Back to home</button></a>')

当扩展程序打开时，页面会刷新回原始的popup.html文件。

如果你想使用标准的HTML而不是通过Javascript...请尝试。

<a href="popup.html"><button class="button">Back to home</button></a>

- unitMeasure App

Answer 2

如果您知道用户来自哪里，并且需要返回并完全重新加载上一页，则应更改位置，而不使用history。否则，如果您想模拟浏览器的“后退”功能，则可以使用history.go(-1)。

顺便说一下，在扩展中不能使用内联代码（请参见this CSP page），因此您必须创建一个脚本并将其加载到页面中，这是一个示例：

HTML：

<input id="go_back" type="button" value="Back"/>
<script src="script.js"></script>

文件 script.js：

document.getElementById('go_back').addEventListener('click', function(e) {
    history.go(-1);

    // or:
    window.location.href = "<old-url>";
});

- Marco Bonelli

---

谢谢，我试了你写的JS代码，但奇怪的是history.go(-1);没有起作用！Chrome扩展页面没有返回。 - Anand

我刚意识到历史对象是浏览器的一部分，而不是扩展程序。我需要在扩展程序内返回。 - Anand

@Anand 可以告诉我，“返回”按钮在哪一页，你想要回到哪一页吗？ - Marco Bonelli

所有操作都在扩展弹出窗口内完成。我已经添加了两张扩展页面的图片。我想从第二页返回第一页。 - Anand