关于菜单栏显示图标

我想在menubar.Iam上使用dojo创建菜单栏来显示图标。请找到提琴：http://jsfiddle.net/nw9tU/351/关于菜单栏显示图标

我试过uisng图标属性来显示菜单栏上的图标，但它没有奏效。下面是示例代码：

require([ 
    "dijit/MenuBar", 
    "dijit/PopupMenuBarItem", 
    "dijit/Menu", 
    "dijit/MenuItem", 
    "dijit/DropDownMenu", 
    "dijit/PopupMenuItem", 
    "dojo/domReady!" 
],function(MenuBar, PopupMenuBarItem, Menu, MenuItem, DropDownMenu,PopupMenuItem){ 
    var pMenuBar = new MenuBar({ 
    }); 


    var pSubMenu = new DropDownMenu({}); 
    pSubMenu.addChild(new MenuItem({ 
     label: "File item #1" 
    })); 
    pSubMenu.addChild(new MenuItem({ 
     label: "File item #2" 
    })); 

    pMenuBar.addChild(new PopupMenuBarItem({ 
     label : "Home", 
     icon: 'https://avatars1.githubusercontent.com/u/5500999?v=2&s=16', 
     popup: pSubMenu 
    })); 

    var withdrawMenu = new Menu({ 
       id: "withdrawMenu" 
      }); 
    withdrawMenu.addChild(new MenuItem({ 
       id: "savings", 
       label: "Savings Acc" 
      })); 
    withdrawMenu.addChild(new MenuItem({ 
       id: "checking", 
       label: "Checking Acc" 
      })); 

    var pSubMenu2 = new DropDownMenu({}); 
    pSubMenu2.addChild(new MenuItem({ 
     label: "Credit" 
    })); 

    pSubMenu2.addChild(new PopupMenuItem({ 
       id: "withdraw", 
       label: "Withdraw", 
       popup: withdrawMenu 
      })); 

    pSubMenu2.addChild(new MenuItem({ 
     label: "Retail" 
    })); 

    pMenuBar.addChild(new PopupMenuBarItem({ 
     label: " || Banking", 
     popup: pSubMenu2 
    })); 

    pMenuBar.placeAt("menuBar"); 
    pMenuBar.startup(); 
});

请建议如何显示在菜单项上，而不是显示标签图标。

来源

2015-05-20 user3692021

根据文档，不可能使用dijit/PopupMenubarItem做到这一点。 http://dojotoolkit.org/reference-guide/1.9/dijit/MenuBar.html#icons

另一种方法是使用dijit/ToolBar相应dropdownbuttons

还要用你需要使用 iconClass财产，并添加CSS样式到文档的图标。例如

在JavaScript文件中。

new MenuItem({ 
     label: "File item #1", 
     iconClass:'myIcon' 
    }

在CSS文件或样式标记中添加以下css。

.myIcon { 
      background-image: url("https://avatars1.githubusercontent.com/u/5500999?v=2&s=16"); 
      width: 18px; 
      height: 18px; 
     }

EDIT1：

如前所述上面你需要使用的dijit/ToolBar，的dijit/DropDownMenu和dijit/form/DropDownButton组合。检查链接。

http://dojotoolkit.org/reference-guide/1.9/dijit/form/DropDownButton.html

来源

2015-05-20 19:15:20 frank

Thanks @frank。但是，当我们使用dijit/ToolBar和相应的下拉按钮时，我们是否可以实现与http://jsfiddle.net/nw9tU/351/中显示的相同类型的下拉菜单。任何的意见都将会有帮助。谢谢。 – user3692021

检查编辑的答案。 – frank

关于菜单栏显示图标

回答

相关问题