<!DOCTYPE html>
<html>
<head>
<title>ZTREE DEMO - select menu</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/demo.css" type="text/css">
<link rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript" src="js/jquery.ztree.excheck-3.5.js"></script>
<script type="text/javascript" src="js/jquery.ztree.exedit-3.5.js"></script>
<script type="text/javascript">
<!--
var setting = {
view: {
dblClickExpand: false
},
data: {
simpleData: {
enable: true
}
},
check: {
enable: true
},
callback: {
onRightClick: OnRightClick
}
};
var zNodes = [
{ id: 1, pId: 0, name: "随意勾选 1", open: true },
{ id: 11, pId: 1, name: "随意勾选 1-1", open: true },
{ id: 111, pId: 11, name: "随意勾选 1-1-1" },
{ id: 112, pId: 11, name: "随意勾选 1-1-2" },
{ id: 12, pId: 1, name: "随意勾选 1-2", open: true },
{ id: 121, pId: 12, name: "随意勾选 1-2-1" },
{ id: 122, pId: 12, name: "随意勾选 1-2-2" },
{ id: 2, pId: 0, name: "随意勾选 2", checked: true, open: true },
{ id: 21, pId: 2, name: "随意勾选 2-1" },
{ id: 22, pId: 2, name: "随意勾选 2-2", open: true },
{ id: 221, pId: 22, name: "随意勾选 2-2-1", checked: true },
{ id: 222, pId: 22, name: "随意勾选 2-2-2" },
{ id: 23, pId: 2, name: "随意勾选 2-3" }
];
function OnRightClick(event, treeId, treeNode) {
if (!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) {
zTree.cancelSelectedNode();
showRMenu("root", event.clientX, event.clientY);
} else if (treeNode && !treeNode.noR) {
zTree.selectNode(treeNode);
showRMenu("node", event.clientX, event.clientY);
}
}
function showRMenu(type, x, y) {
$("#rMenu ul").show();
if (type == "root") {
$("#m_del").hide();
$("#m_check").hide();
$("#m_unCheck").hide();
} else {
$("#m_del").show();
$("#m_check").show();
$("#m_unCheck").show();
}
rMenu.css({ "top": y + "px", "left": x + "px", "visibility": "visible" });
$("body").bind("mousedown", onBodyMouseDown);
}
function hideRMenu() {
if (rMenu) rMenu.css({ "visibility": "hidden" });
$("body").unbind("mousedown", onBodyMouseDown);
}
//显示右鍵
function showRMenu(type, x, y) {
$("#rMenu").show();
if (type == "root") {
$("#rMenu").hide();
} else {
$("#m_del").show();
$("#m_modify").show();
}
//0000000,0000001,0000002,不可以删除修改
zTree = $.fn.zTree.getZTreeObj("treeDemo");
nodes = zTree.getSelectedNodes();
treeNode = nodes[0];
if (treeNode != null) {
treeID = treeNode.id;
if (treeID == '00000000' || treeID == '00000001' || treeID == '00000002') {
$("#m_modify").hide();
$("#m_del").hide();
}
}
rMenu.css({ "top": y + "px", "left": x + "px", "visibility": "visible" });
$("body").bind("mousedown", onBodyMouseDown);
}
//隐藏右鍵
function hideRMenu() {
alert();
if (rMenu) rMenu.css({ "visibility": "hidden" });
$("body").unbind("mousedown", onBodyMouseDown);
}
function onBodyMouseDown(event) {
if (!(event.target.id == "rMenu" || $(event.target).parents("#rMenu").length > 0)) {
rMenu.css({ "visibility": "hidden" });
}
if (!(event.target.id == "rMenu2" || $(event.target).parents("#rMenu2").length > 0)) {
$("#rMenu2").css({ "visibility": "hidden" });
}
}
//鼠标点击事件不在节点上时隐藏右键菜单
$(function () {
$("body").bind(
"mousedown",
function (event) {
if (!(event.target.id == "rMenu2" || $(event.target)
.parents("#rMenu2").length > 0)) {
$("#rMenu2").hide();
}
});
});
/*******************新增 start*********************/
//显示新增
function showRMenu2(x, y) {
$("#rMenu2").show();
$("#rMenu2").css({ "top": y + "px", "left": x + "px", "visibility": "visible" });
$("body").bind("mousedown", onBodyMouseDown);
}
var addCount = 1;
//新增树节点
function addTreeNode() {
$("#rMenu").hide();
//显示新增div
var tag = 0;
$("#treeDemo").mousemove(function (e) {
if (tag == 0) showRMenu2(e.pageX, e.pageY);
$("#caption_bbs").focus();
tag = tag + 1;
});
}
//新增执行后台
function addTree() {
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
var nodes = zTree.getSelectedNodes();
$.ajax({
type: "post",
url: "/cslv/documentation.do",
dataType: 'json',
data: {
action: "addTree",
parentid: nodes[0].id,
nodename: $("#caption_bbs").val()
},
success: function (json) {
//强行加载父节点
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
var nodes = treeObj.getSelectedNodes();
treeObj.reAsyncChildNodes(null, "refresh", true);
if (json == 0) alert("操作失败！");
},
error: function () {
alert('Error loading HTML document');
}
});
$("#rMenu2").css({ "visibility": "hidden" });
$("#caption_bbs").val("");
}
/*******************新增 end*********************/
/*******************修改 start*********************/
function editName() {
$("#rMenu").hide();
zTree = $.fn.zTree.getZTreeObj("treeDemo");
nodes = zTree.getSelectedNodes();
zTree.editName(nodes[0]);
}
//捕获节点编辑名称结束（Input 失去焦点 或 按下 Enter 键）之后，更新节点名称数据之前的事件回调函数，并且根据返回值确定是否允许更改名称的操作
function onRename(treeId, treeNode, newName) {
zTree = $.fn.zTree.getZTreeObj("treeDemo");
nodes = zTree.getSelectedNodes();
treeId = "treeDemo";
treeNode = nodes[0];
newName = nodes[0].name;
if (newName.length == 0) {
alert("节点名称不能为空.");
return false;
}
$.ajax({
type: "post",
url: "/cslv/documentation.do",
dataType: 'json',
data: {
action: "modifyTr
ztree树，带复选框，右键增加，修改，删除节点可连接后台。
4星 · 超过85%的资源 需积分: 44 118 浏览量
2013-08-30
21:47:03
上传
评论 6
收藏 142KB ZIP 举报 
test.zip （28个子文件） 
test js 
jquery.ztree.excheck-3.5.js 21KB jquery.ztree.exhide-3.5.js 10KB jquery.ztree.core-3.5.min.js 28KB jquery.ztree.all-3.5.min.js 58KB jquery.ztree.exedit-3.5.js 43KB jquery.ztree.core-3.5.js 56KB jquery-1.4.4.min.js 77KB jquery.ztree.exhide-3.5.min.js 5KB jquery.ztree.excheck-3.5.min.js 10KB jquery.ztree.all-3.5.js 120KB jquery.ztree.exedit-3.5.min.js 20KB css demo.css 2KB zTreeStyle zTreeStyle.css 6KB img 
zTreeStandard.png 11KB
zTreeStandard.gif 5KB line_conn.gif 45B loading.gif 381B diy 4.png 399B 1_close.png 601B 3.png 762B 1_open.png 580B 7.png 534B 5.png 710B 2.png 570B 6.png 432B 8.png 529B 9.png 467B
test.html 13KB
- 1
- 2
- 3
- 4
- 5
前往页