easyUI 树的上下文菜单

一、属性:onContextMenu

onContextMenu: function(e,node){

e.preventDefault();

$(this).tree('select',node.target);

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

left: e.pageX,

top: e.pageY

});

}

二、菜单的内容

<div id="mm" class="easyui-menu" style="120px;">
<div onclick="append()" data-options="iconCls:'icon-add'">Append</div>
<div onclick="removeit()" data-options="iconCls:'icon-remove'">Remove</div>
<div class="menu-sep"></div>//分割线
<div onclick="expand()">Expand</div>
<div onclick="collapse()">Collapse</div>
</div>

三、菜单的功能函数


<script type="text/javascript">
function append(){
var t = $('#tt');//tt是树的ID
var node = t.tree('getSelected');
t.tree('append', {
parent: (node?node.target:null),
data: [{//点击append够新增的数据
text: 'new item1'
},{
text: 'new item2'
}]
});
}
function removeit(){
var node = $('#tt').tree('getSelected');
$('#tt').tree('remove', node.target);
}
function collapse(){
var node = $('#tt').tree('getSelected');
$('#tt').tree('collapse',node.target);
}
function expand(){
var node = $('#tt').tree('getSelected');
$('#tt').tree('expand',node.target);
}
</script>

原文地址:https://www.cnblogs.com/Lxiaojiang/p/5933473.html