Chrome扩展程序/根据弹出窗口中的选择执行不同的内容脚本.html

Chrome-extension / Execute different content scripts depending on selection in popup.html

本文关键字：执行 选择 html 脚本 程序 扩展 窗口 Chrome      更新时间：2023-09-26

我需要使用以下行为进行扩展。弹出窗口.html应该有两个按钮或两个单选按钮(按钮更容易，因为我不必像收音机那样保存所选值(，并且根据用户选择，我必须执行一个或另一个脚本。此外，在加载其中一个脚本并且用户想要使用另一个脚本后，我必须重新加载页面才能"卸载"前一个脚本。谁能给我一种方法来实现这一点？

目前我有这个：

弹出窗口.js 

$(document).ready(function() {
    var firstTime = true;
    $("input[name='method']").change(function() {
       if($(this).val() === "events") {
            if(!firstTime) {
                chrome.tabs.reload(null, null, function(){
                    chrome.tabs.executeScript(null, {file: "content_events.js", runAt: "document_end"});
                });
            } else {
                chrome.tabs.executeScript(null, {file: "content_events.js", runAt: "document_end"});
                firstTime = false;
            }
        } else {
            if(!firstTime) {
                chrome.tabs.reload(null, null, function(){
                    chrome.tabs.executeScript(null, {file: "content_timer.js", runAt: "document_end"});
                });
            } else {
                chrome.tabs.executeScript(null, {file: "content_timer.js", runAt: "document_end"});
                firstTime = false;
            }
        }
    });
});

manifest.json

"permissions": [
"tabs",
"activeTab",
"<all_urls>"
],

第一次正确加载脚本时，但是当我更改它时，页面会重新加载，但新脚本没有加载(我认为它是在页面刷新之前加载的(。我尝试了 runAt 属性的所有可能性，也没有它。我也尝试没有在tabs.reload的回调函数中注入脚本，但没有运气。

感谢您的帮助！

看起来你想根据变量的值将Javascript文件注入到页面中。您可以使用chrome.tabs.onUpdate方法设置侦听器，然后调用chrome.tabs.executeScript以根据变量的值注入正确的文件。如果您计划在脚本中执行任何 DOM 操作，请务必侦听窗口加载事件。

相关文章：