Chrome 扩展程序 - 在当前选项卡的 popup.html 中激活脚本

用户2284703

我不确定如何正确提出这个问题,因为它很难解释,所以我将使用一个例子。

我想要做的是弄清楚如何使用将与当前选项卡交互的 chrome 扩展程序的 popup.html 内的链接激活类似书签的东西。

例如:如果您单击 chrome 扩展程序图标,则会出现一个弹出窗口(通常的下拉窗口)。在该窗口中会显示一个增加图像大小的按钮(例如书签栏的书签)。

我想要的是该按钮与当前打开的选项卡而不是 popup.html 页面进行交互。

我在清单以及正在定义的脚本中拥有适当的权限(所有 url 和选项卡)。一切都在那里测试正常。但我知道我的解决方案(不工作)可能离谱,我什至可能在这一点上还没有接近。所以我在这里寻求帮助。

背景.js

function zii() {

    function zoomImage(image, amt) {
        if (image.initialHeight == null) { /* avoid accumulating integer-rounding error */
            image.initialHeight = image.height;
            image.initialWidth = image.width;
            image.scalingFactor = 1;
        }
        image.scalingFactor *= amt;
        image.width = image.scalingFactor * image.initialWidth;
        image.height = image.scalingFactor * image.initialHeight;
    }
    var i, L = document.images.length;
    for (i = 0; i < L; ++i) zoomImage(document.images[i], 2);
    if (!L) alert("This page contains no images."); 

}

弹出窗口.html

<button onClick="zii()">Test</button>

后台功能也在 popup.html 页面内部链接。实际的 popup.html 页面非常大,所以我只是在这里展示了它的基础知识,而没有包括与扩展的其他方面相关的所有相关代码。

我显然不知道我做错了什么,或者我正在尝试的事情是否可能。

目标摘要:简单地说,我只想单击 popup.html 中的按钮并增加当前打开的选项卡上图像的大小(与使用书签执行此操作的方式相同)。

卢卡·切莱比奇

首先,我建议阅读扩展架构

如果您想通过单击弹出窗口中的按钮在当前窗口中注入 .js 文件或某些代码,您只需chrome.tabs.executeScript在按钮 onclick 处理程序中使用,同时null作为第一个tabId参数传递因为它默认为活动选项卡当前窗口。

例如:

chrome.tabs.executeScript(null, {
    code: "console.log('Injected.')"
});

或者:

chrome.tabs.executeScript(null, {
    file: "content.js"
});

确保也有"activeTab"你的manifest.json权限。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Chrome扩展程序仅在当前选项卡中更改用户代理

Chrome扩展程序:在当前选项卡上进行事件监听

如何从Chrome扩展程序popup.html中重新加载当前标签页?

如何使用JavaScript在Chrome扩展程序中获取当前选项卡的URL

在当前选项卡 chrome 扩展上更新并运行预定义的链接

Chrome扩展程序-executeScript不在活动选项卡中

Chrome 扩展程序:如何通过单击 html 弹出窗口中的按钮在新选项卡中打开指定链接?

Chrome扩展程序如何将数据从内容脚本发送到popup.html

如何在Chrome扩展程序中的popup.html中访问iframe

如何在Chrome扩展程序中通过鼠标调整POPUP.html页面的大小

在chrome扩展中访问当前选项卡的所有窗口变量

Chrome扩展程序:访问popup.html的DOM并启用jQuery

调试Chrome扩展程序的popup.html吗?

Chrome扩展程序:强制popup.html关闭

Chrome扩展程序更改popup.html文本

从Chrome扩展程序访问当前HTML页面中的表

让 HTML 内联事件在 Chrome 扩展的 popup.js 中工作

Chrome扩展程序中的所有选项卡中设置切换开关状态

仅在Firefox / Chrome扩展程序的一个选项卡中禁用/启用javascript(使用Web扩展程序)

chrome扩展程序中的选项卡更改时的页面内容

无法从我的 chrome 扩展程序的选项卡中获取选定的文本/突出显示的文本

Chrome 扩展程序化 CSS 注入到活动选项卡中的错误

如何将 JavaScript 发送到 Chrome 扩展程序中的特定选项卡?

Chrome扩展程序将Background.js中的值保存到存储中并显示在popup.html上

是否可以将Google Analytics(分析)添加到没有popup.html的Chrome扩展程序中?

单击扩展程序图标时,在新选项卡中打开扩展程序的options.html页面

Chrome扩展程序:获取活动选项卡的源代码

Chrome扩展程序:Javascript注入到活动选项卡

如何在Chrome扩展程序中的后台消息侦听器中检索活动选项卡?