Crossrider扩展中的按需弹出窗口

Question

我正在寻找一种在Crossrider扩展中显示按需弹出窗口的方法，与Javascript的“确认”对话框具有相同的风格。我在资源中有一个HTML页面，我想在弹出窗口中使用它，无论何时发送特定的消息都会显示出来。我意识到在Crossrider (appAPI.browserAction.setPopup)中有显示弹出窗口的功能，但是我想按需显示自定义弹出窗口，而不是简单的JS‘确认’对话框。有没有办法做到这一点？谢谢。

Answer 1

您可以组合使用appAPI.browserAction.setPopup和appAPI.browserAction.clearPopup来控制弹出窗口。在下面的示例中，扩展范围代码根据访问的页面确定需要哪个弹出窗口，并相应地设置它：

extension.js

appAPI.ready(function($) {
    if (appAPI.isMatchPages("*google", "*msn")) {
        // Send message to background to set the popup based on the page url
        appAPI.message.toBackground({
            request: 'set-popup',
            popup: (location.hostname.indexOf('google') !== -1)
                ? 'google.html'
                : 'msn.html'
        });
    } else {
        // Send message to background to clear the popup for other pages
        appAPI.message.toBackground({
            request: 'clear-popup'
        });
    }
});

background.js

appAPI.ready(function($) {
    appAPI.browserAction.setResourceIcon('icon.jpg');
    appAPI.message.addListener(function(msg) {
        switch(msg.request) {
            case 'set-popup':
                // When setting the page, first clear the existing popup
                appAPI.browserAction.clearPopup();
                // then set the new popup
                appAPI.browserAction.setPopup({
                    resourcePath: msg.popup,
                    width: 300,
                    height: 200
                });
                break;
            case 'clear-popup':
                appAPI.browserAction.clearPopup();
                break;
        }
    });
});

披露：我是一名Crossrider员工