jsTree让不同节点有不同的右键菜单

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/j1137573560/article/details/83144816

效果展示:

对于根节点只能建图谱,不能建图谱页,对于图谱(相当于文件夹)可以建图谱和图谱页(相当于文件),对于图谱页只能进行复制粘贴等操作。

 代码描述:

书写右键菜单方法:

 function customMenu(node)
    {
    	var items={
				"createclass" : {
					"label" : "新建图谱",
					"icon"  : "img/map.png",
					"action" : function(obj) {
                            ...
					},

				},
				"createmap":{
					"label" : "新建图谱页",
					"icon"  :"img/mapPage.png",
					"action": function (data) {
						
					}
				},
				"rename" : {
					"label" : "重命名",
					"icon"	:"img/rename1.png",
					"action" : function(obj) {
						
					}
				},
				"deleteItems" : {
					"label" : "删除",
					"icon"	:"img/delete1.png",
					"action" : function(obj) {
						
					}

				},
				"copy" : {
					"label" : "复制",
					"icon"	:"img/copy1.png",
					"action" : function(obj) {
						
					}
				},
				"cut" : {
					"label" : "剪切",
					"icon"	:"img/cut1.png",
					"action" : function(obj) {
						
					}
				},
				"paste" : {
					"label" : "粘贴",
					"icon"	:"img/paste1.png",
					"action" : function(obj) {
						
					}
				}
			}
    	//console.log(node);
    	if(node.parent=='#'){    //如果是根节点
    		delete items.createmap;
    	}else if(node.type=='mapclass'){    //如果是图谱
    		delete items.deleteItems;
    	}else if(node.type=='mapfile'){    //如果是图谱页
    		delete items.createclass;
    		delete items.createmap;	
    	}
    	return items;    //注意要有返回值
    }

引入方法:

"plugins" : [ "dnd", "contextmenu", "types" ],
				"contextmenu" : { 
					"items" : customMenu
				
				
				}

因为项目涉密,因此,只把模板打出来,具体需要读者自行填充。

猜你喜欢

转载自blog.csdn.net/j1137573560/article/details/83144816