javascript - Chrome 扩展程序将输入附加到 URL。

Question

我目前正在创建一个 Chrome 扩展程序，它有一个 popup.html，弹出窗口中有 2 个内容。输入字段和提交按钮。

输入字段从用户那里获取一个 EXTN 号码，当按下提交时，我需要将用户导航到一个新选项卡，将用户的输入附加到末尾。

输入 = 9999 按下提交后，用户将转到:提交 = http://name.com/9999

当我只使用 HTML 文件时，我就可以使用它，但当它作为扩展加载到 Chrome 中时，它似乎没有执行任何操作。

这是我的输入和 onClick 代码:

弹出.HTML

<script src="popup.js"></script>
<input type="text" id="page" />
<input type="submit" value="submit" onclick="goToPage();" />

popup.js

function goToPage() {
var page = document.getElementById('page').value;
window.location = "http://name.com/" + page; }

我知道你不能在 JS 中运行，所以我从 popup.js 文件中调用了它，但它仍然不起作用。

Answer 1

你can't use inline JS in Chrome extension (输入元素中的 onclick="goToPage();" 被视为内联 Javascript)。您必须将所有 Javascript 代码放入单独的文件中。

您将需要使用chrome.tabs用于打开新选项卡的 API。例如:

popup.html

<input type="text" id="page" />
<button id="submit">Submit</button>
<script src="popup.js"></script>

popup.js

document.getElementById('submit').onclick = function(){
    var page = document.getElementById('page').value;
    chrome.tabs.create({url:'http://name.com/' + page});
}