第二部分： Dijit 4.1 弹出菜单

回到目录

04/08/2007 - 11:17 — criecke

---

Wijits和属性

dijit.PopupMenu 提供上下文菜单（尤其是右键点击），或者是下拉按钮（DropDownButton），组合按钮（ComboButton），等等.
targetNodeIds	Array of dom node ids of nodes to attach to. Fill this with nodeIds upon widget creation and it becomes context menu for those nodes.
submenuOverlap	子菜单通常显示在父菜单右边，但会稍微覆盖一点父菜单。这个参数用来控制2个菜单互相覆盖的像素数。
contextMenuForWindow	如果设为 true, 在窗口上任意处右键都可以打开菜单，如果设为 false，则必须指定targetNodeIds
submenuDelay	当鼠标移到子菜单上（但不点击）时，经过多少时间（微秒）子菜单自动打开。

dijit.MenuItem 菜单中的一行
iconSrc:	在菜单文字左边显示图标的路径
caption	菜单文字
submenuId	当菜单项被点击时的ID
accelKey	参见Common Attributes
disabled	参见Common Attributes

dijit.MenuSeparator 菜单2项之间的分隔线

没有属性

例子

弹出菜单可以在窗口的任何一点右键点击激活。

  
  

   
   

    
    
    
    
    
    <
    
    script
    
    >
    
    ...
    
    dojo.require("dijit.Menu");
    
    </
    
    script
    
    >
    
    
...


    
    <
    
    div 
    
    dojoType
    
    ="dijit.PopupMenu"
    
     style
    
    ="display:none;"
    
     contextMenuForWindow
    
    =true"
    
    >
    
    
    
    
    <
    
    div 
    
    dojoType
    
    ="dijit.MenuItem"
    
     iconSrc
    
    ="../../src/widget/templates/buttons/cut.gif"
    
     
                   caption
    
    ="Cut"
    
     accelKey
    
    ="Ctrl+C"
    
    
           onClick
    
    ="alert('not actually cutting anything, just a test!')"
    
    ></
    
    div
    
    >
    
    
    
    
    <
    
    div 
    
    dojoType
    
    ="dijit.MenuItem"
    
     iconSrc
    
    ="../../src/widget/templates/buttons/copy.gif"
    
     
                   caption
    
    ="Copy"
    
     accelKey
    
    ="Ctrl+X"
    
    
           onClick
    
    ="alert('not actually copying anything, just a test!')"
    
    ></
    
    div
    
    >
    
    
    
    
    <
    
    div 
    
    dojoType
    
    ="dijit.MenuItem"
    
     iconSrc
    
    ="../../src/widget/templates/buttons/paste.gif"
    
     
                   caption
    
    ="Paste"
    
     accelKey
    
    ="Ctrl+V"
    
    
           onClick
    
    ="alert('not actually pasting anything, just a test!')"
    
    ></
    
    div
    
    >
    
    
    
    
    <
    
    div 
    
    dojoType
    
    ="dijit.MenuSeparator"
    
    ></
    
    div
    
    >
    
    
    
    
    <
    
    div 
    
    dojoType
    
    ="dijit.MenuItem"
    
     caption
    
    ="Paste Special"
    
     subMenuId
    
    ="pasteSpecialSubmenu"
    
    >
    
    

    
    </
    
    div
    
    >
    
    


    
    <
    
    div 
    
    dojoType
    
    ="dijit.PopupMenu"
    
     id
    
    ="pasteSpecialSubmenu"
    
     style
    
    ="display: none;"
    
    >
    
    
    
    
    <
    
    div 
    
    dojoType
    
    ="dijit.MenuItem"
    
     caption
    
    ="Paste As Text"
    
     onClick
    
    ="alert('Submenu 1!')"
    
    ></
    
    div
    
    >
    
    
    
    
    <
    
    div 
    
    dojoType
    
    ="dijit.MenuItem"
    
     caption
    
    ="Paste As Image"
    
     onClick
    
    ="alert('Submenu 2!')"
    
    ></
    
    div
    
    >
    
    

    
    </
    
    div
    
    >
    
    

   
   
  
  

提示：

• 子菜单要在弹出菜单以外定义。虽然你可能认为应该定义在菜单项内，但实际上不是这样。
• Style="display:none"几乎总是在弹出按钮部件中使用。否则菜单会在右键鼠标点击之前显示。

回到目录