mengjie
/
JiYuan12345_WEB


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273
							<!DOCTYPE html>
<HTML>

	<HEAD>
		<TITLE>课程分类</TITLE>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" href="../css/init.css" />
		<link rel="stylesheet" href="css/demo.css" type="text/css">
		<link rel="stylesheet" href="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.js"></script>
		<script type="text/javascript" src="js/jquery.ztree.excheck.js"></script>
		<script type="text/javascript" src="js/jquery.ztree.exedit.js"></script>
		<SCRIPT type="text/javascript">
			//		<!--
			var setting = {
				view: {
					addHoverDom: addHoverDom,
					removeHoverDom: removeHoverDom,
					selectedMulti: false
				},
				edit: {
					enable: true,
					editNameSelectAll: true,
					showRemoveBtn: true,
					showRenameBtn: true
				},
				data: {
					simpleData: {
						enable: true
					}
				},
				callback: {
					beforeDrag: beforeDrag,
					beforeEditName: beforeEditName,
					beforeRemove: beforeRemove,
					beforeRename: beforeRename,
					onRemove: onRemove,
					onRename: onRename
				}
			};

			var zNodes = [{
					id: 1,
					pId: 0,
					name: "日常管理",
					open: true
				},
				{
					id: 11,
					pId: 1,
					name: "话务礼仪"
				},
				{
					id: 12,
					pId: 1,
					name: "常用知识"
				},
				{
					id: 13,
					pId: 1,
					name: "最新政策"
				},
				{
					id: 2,
					pId: 0,
					name: "职场提升",
					open: true
				},
				{
					id: 21,
					pId: 2,
					name: "职场能力"
				},
				{
					id: 22,
					pId: 2,
					name: "办公软件"
				},
				{
					id: 23,
					pId: 2,
					name: "效率工具"
				},
				{
					id: 3,
					pId: 0,
					name: "语言学习",
					open: true
				},
				{
					id: 31,
					pId: 3,
					name: "普通话锻炼"
				},
				{
					id: 32,
					pId: 3,
					name: "生活英语"
				},
				{
					id: 33,
					pId: 3,
					name: "商务英语"
				}
			];
			var log, className = "dark";

			function beforeDrag(treeId, treeNodes) {
				return false;
			}

			function beforeEditName(treeId, treeNode) {
				className = (className === "dark" ? "" : "dark");
				showLog("[ " + getTime() + " beforeEditName ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
				var zTree = $.fn.zTree.getZTreeObj("treeDemo");
				zTree.selectNode(treeNode);
				setTimeout(function() {
					if(confirm("进入节点 -- " + treeNode.name + " 的编辑状态吗？")) {
						setTimeout(function() {
							zTree.editName(treeNode);
						}, 0);
					}
				}, 0);
				return false;
			}

			function beforeRemove(treeId, treeNode) {
				className = (className === "dark" ? "" : "dark");
				showLog("[ " + getTime() + " beforeRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
				var zTree = $.fn.zTree.getZTreeObj("treeDemo");
				zTree.selectNode(treeNode);
				return confirm("确认删除 节点 -- " + treeNode.name + " 吗？");
			}

			function onRemove(e, treeId, treeNode) {
				showLog("[ " + getTime() + " onRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
			}

			function beforeRename(treeId, treeNode, newName, isCancel) {
				className = (className === "dark" ? "" : "dark");
				showLog((isCancel ? "<span style='color:red'>" : "") + "[ " + getTime() + " beforeRename ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name + (isCancel ? "</span>" : ""));
				if(newName.length == 0) {
					setTimeout(function() {
						var zTree = $.fn.zTree.getZTreeObj("treeDemo");
						zTree.cancelEditName();
						alert("节点名称不能为空.");
					}, 0);
					return false;
				}
				return true;
			}

			function onRename(e, treeId, treeNode, isCancel) {
				showLog((isCancel ? "<span style='color:red'>" : "") + "[ " + getTime() + " onRename ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name + (isCancel ? "</span>" : ""));
			}

			function showRemoveBtn(treeId, treeNode) {
				return !treeNode.isFirstNode;
			}

			function showRenameBtn(treeId, treeNode) {
				return !treeNode.isLastNode;
			}

			function showLog(str) {
				if(!log) log = $("#log");
				log.append("<li class='" + className + "'>" + str + "</li>");
				if(log.children("li").length > 8) {
					log.get(0).removeChild(log.children("li")[0]);
				}
			}

			function getTime() {
				var now = new Date(),
					h = now.getHours(),
					m = now.getMinutes(),
					s = now.getSeconds(),
					ms = now.getMilliseconds();
				return(h + ":" + m + ":" + s + " " + ms);
			}

			var newCount = 1;

			function addHoverDom(treeId, treeNode) {
				var sObj = $("#" + treeNode.tId + "_span");
				if(treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0) return;
				var addStr = "<span class='button add' id='addBtn_" + treeNode.tId +
					"' title='add node' onfocus='this.blur();'></span>";
				sObj.after(addStr);
				var btn = $("#addBtn_" + treeNode.tId);
				if(btn) btn.bind("click", function() {
					var zTree = $.fn.zTree.getZTreeObj("treeDemo");
					zTree.addNodes(treeNode, {
						id: (100 + newCount),
						pId: treeNode.id,
						name: "新建文件" + (newCount++)
					});
					return false;
				});
			};

			function removeHoverDom(treeId, treeNode) {
				$("#addBtn_" + treeNode.tId).unbind().remove();
			};

			function selectAll() {
				var zTree = $.fn.zTree.getZTreeObj("treeDemo");
				zTree.setting.edit.editNameSelectAll = $("#selectAll").attr("checked");
			}

			$(document).ready(function() {
				$.fn.zTree.init($("#treeDemo"), setting, zNodes);
				$("#selectAll").bind("click", selectAll);
			});
			//-->
		</SCRIPT>
		<style type="text/css">
			.ztree li span.button.add {
				margin-left: 2px;
				margin-right: -1px;
				background-position: -144px 0;
				vertical-align: top;
				*vertical-align: middle
			}
			.dhLeft{
				width: 100%;
				border-bottom: 1px solid #DDDDDD;
				line-height: 50px;
			}
			.dhLeft a{
				color: #999;
				font-size: 14px;
			}
			.dhLeft .textspan{
				color: #999;
				font-size: 14px;
			}
			.dhLeft .nowPosition{
				color: #01a1cb;
			}
			.train{
				margin-left: 30px;
				margin-top: 30px;
			}
		</style>
	</HEAD>

	<BODY>
		<div class="train">
			<div class="daoHang clearfix">
				<div class="dhLeft">
					<sapn>
						<i class="syIcon"></i>
						<span class="textspan">位置：</span>
						<a id="ReIndex">首页</a>&gt;
						<a href="javaScript:;">培训中心</a>&gt;
						<a href="" class="nowPosition">分类管理</a>
					</sapn>
				</div>
				<div class="dhRight">
					<a href="" title="刷新"><i class="fa fa-refresh"></i></a>
				</div>
			</div>
			<div class="content_wrap">
				<div class="zTreeDemoBackground left">
					<ul id="treeDemo" class="ztree"></ul>
				</div>
			</div>
		</div>
	</BODY>

</HTML>