如何在页面操作弹出窗口时单击页面操作

Question

来自https://developer.chrome.com/extensions/pageAction.html#event-onClicked:

chrome.pageAction.onClicked.addListener(function(tabs.Tab tab) {...});

单击页面操作图标时触发.如果页面操作有弹出窗口,则不会触发此事件.

那么,如果点击页面操作是否使用弹出窗口,如何判断它何时被点击？

Answer 1

设置弹出窗口后,单击该按钮将导致加载并显示弹出页面.同时,该onClicked事件不会被触发.因此,如果要在设置弹出窗口时检测到单击,请在popup.js中放入一些代码.

例如:如果没有弹出窗口的代码如下所示:

// background/event page
chrome.pageAction.onClicked.addListener(function(tab) {
    // Do something
});

然后从后台/事件页面中删除该段代码,并将代码放在popup.js中:

document.addEventListener('DOMContentLoaded', function() {
    // Do something, e.g. send a message to content or background script
});

如果将逻辑保留在后台页面中很重要,例如,如果您正在启动http请求,数据库访问等,则使用消息传递通知后台页面按钮被单击:

// popup.js
chrome.runtime.sendMessage('pageActionClicked');

// background.js
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
    if (message === 'pageActionClicked') {
        // Do something
    }
});

如果您必须知道当前选项卡(如事件中的tab参数pageAction.onClicked),请使用chrome.tabs.query:

// Inside the DOMContentLoaded or onMessage event listener:
chrome.tabs.query({
    active: true,
    lastFocusedWindow: true
}, function(tabs) {
    var tab = tabs[0];
    // Do something with tab
});