在popup.html和content.js之間的Chrome擴展消息傳遞

Question

因此，我有一個運行在網站上的腳本，並根據某些參數收集一些數據，該腳本本身可以很好地工作，但是我希望能夠有一個帶有單個按鈕的browserAction彈出窗口，單擊該按鈕將觸發上述腳本。

我相信我的問題是我無法通過按下按鈕來發送消息，我也不知道該如何實現，也沒有我閱讀過的browserAction教程。

這是我的代碼：popup.html

<html>
<body style="width: 200px; height: 150px;">
    <script src="background.js"></script>
    <div id="button" style="position:absolute; left: 75px;">
        <button id="mb" onclick="click()">Initialise</button>
    </div>
</body>
</html>

background.js

function click() {
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
        var activeTab = tabs[0];
        chrome.tabs.sendMessage(activeTab.id, {"message": "clicked_browser_action"});
    });
}

content.js

$(document).ready(function(){
    init();
    chrome.runtime.onMessage.addListener(function(request, sender, sendResponse){
        if(request.message === "clicked_browser_action"){
            popup();
        }
    })
});

我知道我的其余代碼都能正常工作，因為我已經通過添加對它進行了測試

browserAction.onClick.addListener(function(tab){ ... });

代替

function click() { ... }

一切都按照我的意願進行。

我將如何正確實現按鈕？

Answer 1

與在html中定義事件內聯相反，您需要在彈出窗口中使用Javascript添加單擊事件監聽器。

document.getElementById("mb").addEventListener("click", function(e){
//event will trigger here
}

在popup.html和content.js之間的Chrome擴展消息傳遞

問題描述

1 個解決方案

解決方案1
0 2018-06-15 19:31:38

在popup.html和content.js之間的Chrome擴展消息傳遞

問題描述

1 個解決方案

解決方案1 0 2018-06-15 19:31:38

解決方案1
0 2018-06-15 19:31:38