jQuery EasyUI API 中文文檔 - 菜單（Menu）

Menu 菜單

用 $.fn.menu.defaults 重寫了 defaults。

用法示例

創建 Menu

經由標記創建 menu 應該添加 'easyui-menu' 類到 <div/> 標記。 每個 menu item 經由 <div/> 標記創建。 我們可以添加 'iconCls' 屬性到 menu item，以定義一個顯示在menu item 左邊的圖標。添加 'menu-sep' 類到 menu item 將產生一個 menu 分隔符。

1. <div id="mm" class="easyui-menu" style="width:120px;">

2. <div>New</div>

3. <div>

4. <span>Open</span>

5. <div style="width:150px;">

6. <div><b>Word</b></div>

7. <div>Excel</div>

8. <div>PowerPoint</div>

9. </div>

10. </div>

11. <div iconCls="icon-save">Save</div>

12. <div class="menu-sep"></div>

13. <div>Exit</div>

14. </div>

編程創建 menu 並偵聽 'onClick' 事件。

1. $('#mm').menu({  

2.     onClick:function(item){  

3. //...

4.     }  

5. }); 

顯示 Menu

當 menu 被創建時，它是隱藏不可見的。調用 'show' 方法來顯示 menu。

1. $('#mm').menu('show', {  

2.   left: 200,  

3.   top: 100  

4. }); 

特性

名稱	類型	說明	默認值
zIndex	number	Menu 的 z-index 樣式， 從它開始增加。.	110000
left	number	Menu 的左邊位置。	0
top	number	Menu 的頂部位置。	0

事件

名稱	參數	說明
onShow	none	當 menu 顯示之后觸發。
onHide	none	當 menu 隱藏之后觸發。
onClick	item	當點擊 menu item 時觸發。

方法

名稱	參數	說明
show	pos	在指定的位置顯示 menu 。 pos 參數有兩個特性： left：新的左邊位置。 top：新的頂部位置。
hide	none	隱藏 menu 。
getItem	itemEl	獲取 menu item 數據並返回，該數據包含下列特性： target：DOM 對象，即 menu item。 id：string，元素的 id 屬性。 text：string，menu item 的文字。 href：string，定位的 url。 disabled：boolean，menu item 禁用與否。 onclick：function，當用戶點擊 menu item 時執行的函數。 iconCls：string，圖標的 CSS 類。
setText	param	給指定的 menu item 設置文字。 'param' 包含兩個特性： target：DOM 對象，被設定的 menu item 。 text： string，新的文字值。
setIcon	param	給指定的 menu item 設置圖標。 'param' 包含兩個特性： target： DOM 對象， 即 menu item。 iconCls： 新圖標的 CSS 類。
findItem	text	找到指定的 menu item， 返回對象與 getItem 方法相同。
appendItem	param	追加 menu item， 'param' 參數包含下列特性： parent： DOM 對象， 新 menu item 將追加到其中， 如果沒有設定， 新menu item 將作為頂級 menu item。 text： string， menu item 的文字。 href： string， 定位的 url 。 onclick： string 或者 function， 當用戶點擊 menu item時執行的腳本代碼或者函數。 iconCls： string， 圖標的 CSS 類。
removeItem	itemEl	移除指定的 menu item。
enableItem	itemEl	啟用 menu item。
disableItem	itemEl	禁用 menu item。