【问题标题】:How to add a dropdown menu to a firefox addon sdk powered addon toolbar button?如何将下拉菜单添加到 Firefox 插件 sdk 驱动的插件工具栏按钮?
【发布时间】:2012-05-26 10:00:35
【问题描述】:

我使用https://github.com/erikvold/toolbarbutton-jplib/ 包将一个工具栏按钮从一个addon-sdk 插件添加到firefox 导航栏。是否可以向此按钮添加下拉菜单(据我所知没有简单的方法)?

【问题讨论】:

    标签: firefox button menu


    【解决方案1】:

    这段代码需要多几行才能真正起作用:

    var delegate = {
    onTrack: function(window) {
    
        if(window.location != "chrome://browser/content/browser.xul") {
            // console.log("=> win location false");
            return;
        }
    
        var document = window.document;
        var navBar = document.getElementById('nav-bar');
    
        var btn = document.createElement('toolbarbutton');
        btn.setAttribute('id', 'button');
        btn.setAttribute('type', 'menu-button');
        btn.setAttribute('class', 'toolbarbutton-1');
        btn.setAttribute('image', 'http://www.facebook.com/favicon.ico');
    
        btn.addEventListener('command', function() {
                console.log("this=" + this.id);
                // your callback code here
            }
            , false);
    
        var menupopup = document.createElement('menupopup');
        menupopup.setAttribute('id', 'menupopup');
        menupopup.addEventListener('command', function(event) {
                // TODO your callback
            }
            , false);
    
        //menu items
        var menuitem1 = document.createElement('menuitem');
        menuitem1.setAttribute('id', 'menuitem1');
        menuitem1.setAttribute('label', 'Menu item1');
        menuitem1.setAttribute('class', 'menuitem-iconic');
        menuitem1.addEventListener('command', function(event) {
                // CODE
            }
            , false);
    
        menupopup.appendChild(menuitem1);
        btn.appendChild(menupopup);
        navBar.appendChild(btn);
    
        console.log("window tracked");
    
        }
    };
    
    //let utils = require('api-utils/window-utils');
    let utils = require('sdk/deprecated/window-utils'); // for new style sdk
    utils.WindowTracker(delegate);
    

    【讨论】:

    • 嘿!这真的有效!它也是即插即用的 - 只需将其粘贴到您的 index.js 文件中,无需任何编辑即可使用!
    • 啊,该代码适用于导航栏,但尝试使用它在 addonsdk 按钮上构建菜单 - shooie!我想不通。
    【解决方案2】:

    我就是这样做的;希望它对你有用。

    var winUtils = require("window-utils");
    
    var delegate = {
        onTrack: function(window) {
            if(window.location != "chrome://browser/content/browser.xul") {
                // console.log("=> win location false");
                return;
            }
    
            console.log("window tracked");
    
            var document = window.document;
            var navBar = document.getElementById('nav-bar');
    
            var btn = document.createElement('toolbarbutton');  
            btn.setAttribute('id', 'button'); 
            btn.setAttribute('type', 'menu-button');  
            btn.setAttribute('class', 'toolbarbutton-1'); 
            btn.setAttribute('image', 'http://www.facebook.com/favicon.ico');
    
            btn.addEventListener('command', function() {
            console.log("this=" + this.id); 
                        // your callback code here
                    }
            , false);
    
            var menupopup = document.createElement('menupopup');
            menupopup.setAttribute('id', 'menupopup');
            menupopup.addEventListener('command', function(event) {
                // TODO your callback
              }
            , false);
    
            //menu items
            var menuitem1 = document.createElement('menuitem');
            menuitem1.setAttribute('id', 'menuitem1');
            menuitem1.setAttribute('label', 'Menu item1');
            menuitem1.setAttribute('class', 'menuitem-iconic');
            menuitem1.addEventListener('command', function(event) {
                    // CODE
                }
            , false);
     }
      winUtils.WindowTracker(delegate);
    

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-11-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-05-27
    • 1970-01-01
    相关资源
    最近更新 更多