The easyUI binding shortcut menu is displayed on the Data row

The div of the display data of easyUI has a style, such

All tables have a datagrid-cell style, so we can use jquery to bind time.
The following is the main js Code:

[Javascript]/* Right-click binding */
$ (". Datagrid-cell"). live ('textmenu ', function (e ){
// Display the shortcut menu
$ ('# Mm'). menu ('show ',{
Left: e. pageX,
Top: e. pageY
});

Return false;
});
/* Right-click the binding */
$ (". Datagrid-cell"). live ('textmenu ', function (e ){
// Display the shortcut menu
$ ('# Mm'). menu ('show ',{
Left: e. pageX,
Top: e. pageY
});

Return false;
}); Below is the HTML code of the menu:

[Html] <! -- Menu -->
<Div id = "mm" class = "easyui-menu" style = "width: 120px;">
<Div> New </div>
<Div>
<Span> Open </span>
<Div style = "width: 150px;">
<Div> <B> Word </B> </div>
<Div> Excel </div>
<Div> PowerPoint </div>
</Div>
</Div>
<Div iconCls = "icon-save"> Save </div>
<Div class = "menu-sep"> </div>
<Div> Exit </div>
</Div>

This setting will be displayed on the table:

Look at the non-Table location:

 
 


From yhc13429826359