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 的员工]