Question

因此，当用户在popup.html中单击“提交”时，我需要将文本框值（在popup.html中）传递给我的内容脚本。我阅读了很多教程，但我无法理解他们的所作所为。

popup.html：

<!DOCTYPE html>
<html>

<body>

<form>
    <input type="text" placeholder="MCM Username" id="username"><br>
    <input type="checkbox" name="vehicle" value="Bike" checked> ON?<br>
    <input type="submit" placeholder="MCM Username" id="sbBtn">


</body>
</html>

的manifest.json：

{
    "name": "MCMRainbowName",
    "manifest_version": 2,
    "version": "1.0.0",
    "description": "Turn your name into a rainbow color on MC-Market.",
    "browser_action":
    {
        "default_icon": "icon.png",
        "default_popup": "onoff.html"
    },

    "content_scripts":[
        {
            "matches":["http://mc-market.org/*", "https://mc-market.org/*"],
            "js": ["rainbow.js"]
        }
    ]
}

rainbow.js（我的内容脚本）：

var username = "RaghavJhavar";

setInterval(function() {
    var elements = document.getElementsByTagName("span");

    for(var i = 0; i < elements.length; i++){
        if(elements[i].innerText == username /*|| elements[i].innerText == "RaghavJhavar"*/){
            document.getElementsByTagName("span")[i].setAttribute("class", "style21");
        }
    }
}, 1000);

当用户点击＆＃34;提交＆＃34;在popup.html上，如何发送文本框值id =＆＃34; username＆＃34;到rainbow.js？我希望rainbow.js中的变量用户名等于带有id＆＃39;用户名＆＃39;的文本框值。在popup.html中。

你能解释一下如何做吗？

非常感谢。

Answer 1

在弹出式脚本中，使用chrome.runtime.sendMessage https://developer.chrome.com/extensions/runtime#method-sendMessage向内容脚本发送消息

在内容脚本中，使用chrome.runtime.onMessage https://developer.chrome.com/extensions/runtime#event-onMessage从后台脚本

接收消息

请阅读文档Message Passing

将popup.html中的文本框值传递到Chrome扩展程序中的内容脚本

1 个答案: