javascript - Firefox 插件 SDK : prompt with multiple checkboxes

Question

我正在为客户开发 Firefox 附加组件。

当用户卸载附加组件时，我需要向用户显示一个提示，其中包含三个复选框。这些复选框将作为用户恢复他/她以前的浏览器设置的选项。

我已经在 uninstall/disable 上成功创建了一个提示符, 使用 confirmCheck nsIPromptService 的方法界面:

let value = {value: true};

let confirm = promptService.confirmCheck(
    null,
    "Uninstall My Extension",
    "You are uninstalling My Extension. You can chose these options to restore your settings to previous state.",
    "Remove My Extension as the default search engine, homepage, new tab landing page, and restore to my previous settings",
    value
);

唯一的问题是，它只包含一个复选框，我需要 3 个不同的复选框，分别用于“搜索引擎”、“主页”和“新标签页网址”。

我通过附加 SDK 使用 chrome 代码，不熟悉 XUL。

我该怎么办？我真的需要学习 XUL 来创建简单的提示吗？

Answer 1

好吧，回答我自己的问题，正如我想出来的那样。我发现(相对而言)最简单的方法是使用 XUL:

这是我的 prompt.xul :

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
<dialog id="myDialog"
        title="My Extension"
        xmlns:html="http://www.w3.org/1999/xhtml"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        onload="init();"
        buttons="accept"
        buttonlabelaccept="OK"
        ondialogaccept="return doContinue();">

    <script type="application/x-javascript">
        function init() {

        }

        function doContinue() {
            window.arguments[0].CHECK_1 = document.querySelector('#check_1').checked;
            window.arguments[0].CHECK_2 = document.querySelector('#check_2').checked;
            window.arguments[0].CHECK_3 = document.querySelector('#check_3').checked;
            return true;
        }
    </script>

    <html:div style="width: 410px;">
        <html:div>
            <html:p>You have selected to uninstall My Extension</html:p>
        </html:div>
        <html:blockquote id="checkboxes_container">
            <html:div id="remove_search_container">
                <html:input type="checkbox" id="check_1" value="true" checked="true"/>
                <html:label for="check_1">Label 1</html:label>
            </html:div>
            <html:div id="remove_homepage_container">
                <html:input type="checkbox" id="check_2" value="true" checked="true"/>
                <html:label for="check_2">Label 2</html:label>
            </html:div>
            <html:div id="remove_newtab_container">
                <html:input type="checkbox" id="check_3" value="true" checked="true"/>
                <html:label for="check_3">Label 3</html:label>
            </html:div>
        </html:blockquote>
    </html:div>
</dialog>

将 chrome 包添加到 chrome.manifest 后，应该可以通过以下方式访问此文件:

chrome://YOUR_PACKAGE_NAME/content/PATH_TO_dialog.xul

我正在使用 chrome 代码加载提示，在 main.js 中:

let Window = Cc["@mozilla.org/embedcomp/window-watcher;1"]
            .getService(Ci.nsIWindowWatcher);

let arg = {

    CHECK_1: false,

    CHECK_2: false,

    CHECK_3: false

};

let window = Window.activeWindow.openDialog("chrome://YOUR_PACKAGE_NAME/content/PATH_TO_dialog.xul", "myWindow", "chrome,modal,centerscreen", arg);

用户关闭提示后，arg 对象将包含提示的复选框值。例如，如果用户勾选所有复选框，arg 对象将是:

{

    CHECK_1 : true,

    CHECK_2 : true,

    CHECK_3 : true

}

这对我有用。祝你有美好的一天!