ztree API中的那种点击子节点就显示的提示框是怎么做的
ztree吧
全部回复
仅看楼主
level 3
mbl0908 楼主
2012年08月31日 03点08分 1
level 13
我的完整代码
<SCRIPT type="text/javascript">
var zTreeObj;
var zNodes =[{id:"0",name:"生产管理",isParent:true,open:true}]; //初始化一个顶层默认节点
var setting = {
check: {
enable: true
},
async: {
enable: true,//需要采用异步方式获取子节点数据,默认false
url:"${ctx}/sysMenuAction.do?method=getMenu", //当 async = true 时,设置异步获取节点的 URL 地址
autoParam:["id=id"],
//treeNodeKey : "id", //在isSimpleData格式下,当前节点id属性
//treeNodeParentKey : "pid", //在isSimpleData格式下,当前节点的父节点id属性
otherParam:{"otherParam":"zTreeAsyncTest"},
expandSpeed : "slow",//设置 zTree节点展开、折叠时的动画速度或取消动画(三种默认定义:"slow", "normal", "fast")或 表示动画时长的毫秒数值(如:1000)
dataFilter: null
},
callback: {
onClick: onTreeClick
}
};
function filter(treeId, parentNode, childNodes) {
if (!childNodes) return null;
for (var i=0, l=childNodes.length; i<l; i++) {
childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');
}
return childNodes;
}
function onTreeClick(event, treeId, treeNode, clickFlag){
alert(treeNode.url_);
parent.mainFrame.location.href = "${ctx}/"+treeNode.url_;
}
$(document).ready(function(){
zTreeObj = $.fn.zTree.init($("#tree1"), setting,zNodes);
});
</SCRIPT>
onTreeClick 这个方法就会在点击每个节点的时候调用
注意看API和DEMO,里面有类似的例子
2012年08月31日 03点08分 2
level 3
mbl0908 楼主
我想说的是 ztree API中点击子节点就出来的提示框效果是怎么制作的 不是数据时怎么取得。。。。就是点击子节点
出来一个提示框 上面有关于这个子节点的一些信息,左边有一个箭头指向对应的子节点,点击别的子节点后就关闭这个提示框,重新打开关于当前选中子节点的提示框 我想知道这种效果是怎么制作的 不用管数据是怎么取得的
2012年08月31日 04点08分 3
zTree 是利用 属性保存文件名,点击后读取 html 直接放置到 div 里面的。 你可以看看网站的源码,右键查看源代码即可
2012年08月31日 06点08分
回复 zTreeAPI :如果不读取HTML该怎么制作这种效果
2012年08月31日 08点08分
回复 mbl0908 :那就看你想怎么实现了,其实简单的说,就是 js 捕获点击事件以后,根据数据在模版div 上显示内容。 但如果你把这么多内容都放在节点数据中也有问题,因为初始化时加载的数据太多了。 不过你可以考虑利用 ajax 从后台读取显示内容。
2012年09月02日 09点09分
这个我明白,我现在就是对CSS样式这块不是很熟悉,我的想法就是当点击之后触发AJAX事件,根据这个子节点的ID到后台查询数据,然后把返回的数据显示到DIV里面,我想知道的是这种样式的CSS 还有就是关于这个DIV的左边的箭头指向问题
2012年09月02日 15点09分
level 3
mbl0908 楼主
回复 zTreeAPI :树哥,能不能做一个关于这种提示框的例子,不用外置HTML文件的,api文档的源码有些看不懂,找不到头绪,对JS和CSS这块不怎么熟,
2012年09月03日 08点09分 4
不过最近工作比较忙,没有时间专门做这个例子呀, api 文档的源码的确东西比较多。。。其实这部分关于如何加载内容的逻辑并不复杂,麻烦的是位置计算。
2012年09月03日 13点09分
1