1

我有一个简单的问题，我有这三个文件 popup.html：

<script>
    function buttonClicked(button) 
    {
        chrome.extension.sendRequest({command:button.id});
    }
</script>
    <input style="width:100%" type="button" value="Click me" id="click" onclick="buttonClicked(this)"/><br/>

背景.html：

<script>
    function processRequest(request, sender, sendResponse) 
    {
        alert('hi');
        sendResponse({});
    }
    chrome.extension.onRequest.addListener(processRequest);
</script>

和 contentscript.js

s = document.getElementsByClassName('st');
if (s[0].innerText != '') { 
st = new Array(); 
for (i = 0;i<s.length;i++) {
    st[i] = s[i].innerText;
}
chrome.extension.sendMessage({"message" : st}, function(response) {});
}

每次单击弹出页面中的按钮时，我都想启动 contentscript，原因是因为 contentscript 中的脚本既不工作，也不在 background.html 上工作，也不在 popup.html 上工作？

谢谢你

4

1 回答 1

2

我试图在评论中解释解决方案以及为什么要使用它，三遍。由于您不理解它，我将参考您的代码再次解释它：

弹出窗口

  • 将内联脚本移动到外部文件，例如popup.js.
  • 删除内联事件侦听器，并将其移至popup.js.

popup.js

function buttonClicked(button) {
    chrome.extension.sendRequest({command: button.id});
}
document.getElementById('click').addEventListener('click', function() {
    buttonClicked(this);
});

popup.html

<script src="popup.js"></script>
<input style="width:100%" type="button" value="Click me" id="click"><br>

如果您测试前面的代码，您会发现它不起作用。这是因为 的内容popup.js在按钮之前执行（发生在按钮创建之后。这<script src>可以通过两种方式解决（使用任何一种方法，但不能同时使用两种方法）：

  • 推荐：<script src="popup.js"></script>放在结束</body>标签之前popup.html。然后，您确定在执行脚本时所有元素确实存在。

  • 替代方法：将事件侦听器调用包装在一个DOMContentLoaded事件中：

    document.addEventListener('DOMContentLoaded', function() {
    document.getElementByUd('click').addEventListener( ... );
});

背景页面。

有关可用选项的更详尽说明，请参阅此答案的中间部分。

  • 修改清单文件，使用"background": {"scripts": ["background.js"]}.
  • 重命名background.html为，然后从文件background.js中删除<script>and 。</script>
于 2012-08-12T14:06:38.760 回答