/** 配置:知识点管理 */
var setting = {
view: {
showIcon: false,
addDiyDom: addPrevDom,
addHoverDom: addHoverDom,
removeHoverDom: removeHoverDom,
selectedMulti: false
},
callback: {
beforeDrag: beforeDrag,
beforeDrop: beforeDrop,
beforeRemove: beforeRemove,
beforeRename: beforeRename,
beforeExpand: beforeExpand
},
edit: {
drag: {
isCopy: false,
isMove: true
},
enable: true,
editNameSelectAll: true,
removeTitle: '删除知识点',
renameTitle: '修改知识点名称',
}
};

setting

回调函数:

/** 添加根节点前科目标记 */
function addPrevDom(treeId, treeNode) {
if (treeNode.level == 0) {
var aObj = $("#" + treeNode.tId + "_a");
var prevStr = "<span>[数学]</span>";
aObj.before(prevStr);
}
} /** 节点拖拽 */
function beforeDrag(treeId, treeNodes) {
for (var i=0,l=treeNodes.length; i<l; i++) {
if (treeNodes[i].drag === false) {
curDragNodes = null;
return false;
} else if (treeNodes[i].parentTId && treeNodes[i].getParentNode().childDrag === false) {
curDragNodes = null;
return false;
}
}
curDragNodes = treeNodes;
return true;
}
function beforeDrop(treeId, treeNodes, targetNode, moveType) {
return targetNode ? targetNode.drop !== false : true;
} /** 修改节点名称 */
function beforeRename(treeId, treeNode, newName) {
if (newName.length == 0) {
var zTree = $.fn.zTree.getZTreeObj("manageTree");
zTree.cancelEditName();
return false;
}
return true;
} /** 删除节点 */
function beforeRemove(treeId, treeNode) {
var _modal = $("#model-delete");
$(".tips-delete",_modal).children("span").text(treeNode.name);
_modal.modal("show");
//确定按钮事件
$("#btn-do-delete").click(function() {
var zTree = $.fn.zTree.getZTreeObj("manageTree");
zTree.removeNode(treeNode);
_modal.modal("hide");
});
return false;
} /** 添加鼠标经过显示编辑图标 */
var newCount = 1;
function addHoverDom(treeId, treeNode) {
//最底层节点不能添加子节点
if (treeNode.level > 2) {
return;
}
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='新增子节点' onfocus='this.blur();'></span>";
sObj.after(addStr);
var btn = $("#addBtn_" + treeNode.tId);
if (btn) btn.bind("click", function() {
var zTree = $.fn.zTree.getZTreeObj("manageTree");
zTree.addNodes(treeNode, {
pId: treeNode.id,
name: "新节点" + (newCount++)
});
return false;
});
};
/** 移除鼠标经过事件 */
function removeHoverDom(treeId, treeNode) {
$("#addBtn_" + treeNode.tId).unbind().remove();
}; /** 展开所有子节点 */
function beforeExpand(treeId, treeNode) {
var zTree = $.fn.zTree.getZTreeObj("manageTree");
zTree.expandNode(treeNode, true, true, false);
return false;
}

ztree.js的使用整理的更多相关文章

  1. js数组学习整理

    原文地址:js数组学习整理 常用的js数组操作方法及原理 1.声明数组的方式 var colors = new Array();//空的数组 var colors = new Array(3); // ...

  2. 使用ztree.js,受益一生,十分钟学会使用tree树形结构插件

    看到ztree.js,这几个字眼,毋庸置疑,那肯定就是tree树形结构了,曾经的swing年代有jtree,后来jquery年代有jstree和treeview,虽然我没写过,但是我见过,一些小功能做 ...

  3. JS正则表达式大全(整理详细且实用)

    JS正则表达式大全(整理详细且实用).需要的朋友可以过来参考下,希望对大家有所帮助!! 正则表达式中的特殊字符 字符 含意 \ 做为转意,即通常在"\"后面的字符不按原来意义解释, ...

  4. Js Date泣血整理

    原文:Js Date泣血整理 JS Date 对象用于处理日期和时间. 创建 Date 对象的语法: var myDate=new Date() Date 对象会自动把当前日期和时间保存为其初始值. ...

  5. vue.js面试题整理

    Vue.js面试题整理 一.什么是MVVM? MVVM是Model-View-ViewModel的缩写.MVVM是一种设计思想.Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务 ...

  6. SVG.js 元素操作整理(二)-Transform

    一.transform()获取或设置矩阵变换 var draw = SVG('svg1').size(300, 300); //Transforming SVG元素矩阵变换 var rect = dr ...

  7. SVG.js 元素操作整理(一)

    一.属性操作Attributes var draw = SVG('svg1').size(300, 300); //attr() 属性操作 //设置属性的值 var rect = draw.rect( ...

  8. 开发类似"音速启动"的原创工具简码"万能助手"的过程中对ztree.js与win标准控件treeview、HTMLayout树形框等优缺点的比较

    在开发类似"音速启动"的桌面快捷方式管理软件简码"万能助手"的早期规划中,曾经考虑过几种树形框方案: ztree.js.win标准控件treeview.HTML ...

  9. 【前端芝士树】Vue.js面试题整理 / 知识点梳理

    [前端芝士树] Vue.js 面试题整理 MVVM是什么? MVVM 是 Model-View-ViewModel 的缩写. Model代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑. ...

随机推荐

  1. Ignite安装配置——中篇

    Linux Ignite配置——上篇大体介绍了一下Ignite工具的功能.特性等,以及如何在Linux 上安装配置.从上篇可见Ignite安装非常的简单方便.下面介绍一下Ignite Reposito ...

  2. SQL SERVER中的OLEDB等待事件

    OLEDB等待事件介绍 OLEDB等待类型是SQL SERVER 数据库中最常见的几种等待类型之一.它意味着某个会话(SPID)通过SQL Server Native Client OLEDB Pro ...

  3. python版本升级

    python 2.7.11,下载链接  https://www.python.org/ftp/python/2.7.11/Python-2.7.11.tgz,如下载速度太慢可在豆瓣pypi搜索下载ht ...

  4. Sqlserver游标复习

    经常写存储过程,但今天在游标使用过程中还是疏忽了一些事情,执行过程中一直执行不下去,后来直接sqlserver挂了,教训啊! 代码虽简单,望铭记: Create PROCEDURE [dbo].[te ...

  5. TJ2016 CTF Write up

    No zuo no die. Use markdown to write writeup in the future......

  6. UVA - 11584 Partitioning by Palindromes[序列DP]

    UVA - 11584 Partitioning by Palindromes We say a sequence of char- acters is a palindrome if it is t ...

  7. flush和reflush

    /** * jpa 中的reflush 同 hibernate 中 Session 的 refresh 方法. * * reflush 会强制发送sql查询(select)语句,使缓存中的数据和数据库 ...

  8. MAVEN构建Spring +Spring mvc + Mybatis 项目(Maven配置部分(workshop))

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...

  9. Smokeping -- 监控网络质量

    1.下载fping.echoping.smokeping 链接:http://pan.baidu.com/s/1pL4HLYb 密码:fxe2 2.安装依赖包 yum install -y perl ...

  10. 系统修改利器XueTr

    Windows系统修改利器XueTr 周银辉 在Windows下如果遇到某些进程弄死结束不了,某些文件弄死删不掉,拷贝不出来 (可能是因为你没有管理员权限,可能是因为人家是病毒,可能是系统保护文件,可 ...