在检查弹出窗口时,Google Chrome的行为会有所不同

时间:2011-08-20 16:45:58

标签: javascript google-chrome console google-chrome-extension

在我尝试学习如何编写Google Chrome扩展程序时,我决定编写一个单击弹出窗口中的按钮,扩展程序打开一个新窗口并为页面上的每个图像打开一个新选项卡。每个标签的url是每个图像的src。 (我认为这不是特别有用,我只是把它作为一种练习)。

奇怪的是,当我右键单击扩展图标并单击“检查弹出窗口”时,它的工作方式与我的预期完全相同。当我正常使用它时, 没有按预期工作。正常使用时,它只会打开3或4张图像(甚至更奇怪的是,它每次都会打开不同数量的图像)。

这是我的代码

popup.html

<script type="text/javascript">

function getImages() {
    chrome.tabs.getSelected(null, function(tab){
        chrome.tabs.sendRequest(tab.id, {code: "getImages"}, function(images) {
            console.log(images);
            openImages(images);
        });
    });
}

function openImages(images) {
    chrome.windows.create({url: images[0]}, function(window) {
        for(var i=1; i<images.length; i++) {
            chrome.tabs.create({windowId: window.id, url: images[i]});
        }
    });
}

</script>

<button onclick="getImages();">Open images</button>

contentscript.js

chrome.extension.onRequest.addListener(
    function(request, sender, response) {
        if(request.code == 'getImages') {
            console.log("We're in!");
            var urls = [];
            var images = document.getElementsByTagName("img");

            for(var i=0; i<images.length; i++) {
                urls.push(images[i].src);
            }
            console.log(urls);
            response(urls);
        }
    }
);

任何人都有任何想法,为什么会这样?

1 个答案:

答案 0 :(得分:1)

当您打开新窗口时,它会获得焦点,从而弹出窗口失去焦点。通常情况下,Chrome会在失去焦点时关闭扩展弹出窗口,但在使用WebInspector进行检查时会保持打开状态。似乎在弹出页面中,您的images列表变量被杀死了。

其他3个想法可以解决这个问题:

  • 而不是一个网址,为windows.create()功能提供一系列网址。 (最佳解决方案)
  • 在不给予焦点的情况下创建窗口(将"focused ": false添加到赋予create函数的对象中),并在创建最后一个选项卡时仅对其进行焦点化。
  • 从内容脚本或背景页面打开标签。
相关问题