ext树形菜单加上右键菜单是不是很酷,ext当然也能实现。 树形菜单如果加上右键事件是不是更接近C/S软件的效果呢?ext当然能够做到,看下面的代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function(){
//定义树的跟节点
var root=new Ext.tree.TreeNode({
id:"root",//根节点id
text:"我是树根"
});
//定义树节点
var c1=new Ext.tree.TreeNode({
id:*c1*,//子结点id
text:*我是大儿子*
});
root.appendChild(c1);//为根节点增加子结点c1
//生成树形面板
var tree=new Ext.tree.TreePanel({
renderTo:"show",
root:root,//定位到根节点
animate:true,//开启动画效果
enableDD:false,//不允许子节点拖动
border:false,//没有边框
rootVisible:true//设为false将隐藏根节点,很多情况下,我们选择隐藏根节点增加美观性
});
//定义右键菜单
var rightClick = new Ext.menu.Menu({
id :*rightClickCont*,
items : [{
id:*rMenu1*,
text : *菜单1*,
//增加菜单点击事件
handler:function (){
alert(*我被点击了!*);
}
}, {
id:*rMenu2*,
text : *菜单2*
}, {
id:*rMenu3*,
text : *菜单3*
}]
});
//增加右键点击事件
c1.on(*contextmenu*,function(node,event){//声明菜单类型
event.preventDefault();//这行是必须的,谁能解释下,我没搞懂-_-||
rightClick.showAt(event.getXY());//取得鼠标点击坐标,展示菜单
});
})
</script>
<div id="show"></div>
</body>
</html>
分享到:
相关推荐
菜单树 右键菜单树 导航树 菜单树 右键菜单树 导航树 checkbox模式 radio模式 相互学习 资源分不高!
ext带右键菜单的树 ext带右键菜单的树
C#Tree View右键菜单,树节点编辑,增加节点,删除节点,复制粘贴节点
JS 带右键菜单的目录树 dhtmlxtree+proto.menu JS 带右键菜单的目录树 dhtmlxtree+proto.menu JS 带右键菜单的目录树 dhtmlxtree+proto.menu ...
3种不同的ContextMenu右键菜单演示.,3种不同的ContextMenu右键菜单演示.3种不同的ContextMenu右键菜单演示.
此JS是著名的二手车网站www.che2.com后台CMS的特效,整理出来由大家共享使用。
下面是复选框的且带右键菜单的树代码。 HTML code Ext.BLANK_IMAGE_URL = "../resources/images/default/s.gif"; Ext.QuickTips.init(); Ext.state.Manager.setProvider(new Ext.state.CookieProvider()); ...
为树形控件添加右键功能,用一个treeview控件和一个contextmenustrip控件实现,在contextmenustrip中编写右键菜单。
WPF MVVM模式下TreeView右键选中项,右键菜单 博客地址:http://www.cnblogs.com/xcong/
JS 带右键菜单的目录树 dhtmlxtree+proto.menu 分权限 JS 带右键菜单的目录树 dhtmlxtree+proto.menu 分权限 图片预览 ...
elementui表格上右键单击弹出菜单项,点击菜单调用后续方法
使用到的技术 1.javascript Object 2.ajax 3.JavaBean&Servlet&JSP
花生米AJAX-UI系列之:基于JQUERY的右键菜单0.1版 可以对表格,列表,"树",或者单个DOM容器进行右键绑定 菜单项的文字、图标样式,调用方法均可自定义 菜单中分隔符的多少和位置也可自定义 提供了菜单项中那一项被...
echarts2.2.7实现组织结构图及自定义右键菜单。 使用方法:http://blog.csdn.net/xieedeni/article/details/78908402
效果实现教程地址:https://blog.csdn.net/qq_27884377/article/details/82288166
关于Javascript带右键功能的动态菜单树
带右键菜单跟checkbox的Dtree实现右键添加修改删除树的节点并与数据库作关联,工程内包含数据库建库建表脚本由于在new dtree的时候有点错误请大家下载完后自行修改
ztree动态异步数据树加载,并且附带右键菜单功能,对树节点进行操作
ztree右键菜单,javascript源码展示。
1、右键菜单(右键菜单中包括:新建、修改、共享、删除、刷新等功能) 2、拖拽排序 教程:http://blog.csdn.net/zm2714/article/details/7936565 本压缩包内实例代码是PHP+mySQL实现,其它语言稍做修改即可实现。...