zTree高度不正确问题，展开父级菜单后整个容器高度反而变小了，如何解决？? 400 报错

@ztree 请求帮助，以下为测试代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ztree高度不正确问题</title>
<link type="text/css" rel="stylesheet">  
<script type="text/javascript" src="js/jquery-1.9.1.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.exhide-3.5.js"></script>
<script type="text/javascript">
// 调用
$(document).ready(function(){
	// 配置
	var setting = {
		data: {
			simpleData: {
				enable: true,
				idKey: "id",
				pIdKey: "pId"
			}
		},
		callback: {
			onClick: onClick
		}
	};
    
	function onClick(event, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj(treeId);
		if(treeNode.isParent){
			zTree.expandNode(treeNode);
			$("#msg").html($("#tree").height());
		}
	}
	
	var treeNodes = [
			{ id:1, pId:0, name:"Root", "isParent":true, open:true, iconOpen:"css/img/diy/1_open.png", iconClose:"css/img/diy/1_close.png"},
			{ id:11, pId:1, name:"父节点 1-1","isHidden":false, open:true},
			{ id:111, pId:11, name:"叶子节点 1-1-1"},
			{ id:112, pId:11, name:"叶子节点 1-1-2"},
			{ id:113, pId:11, name:"叶子节点 1-1-3"},
			{ id:114, pId:11, name:"叶子节点 1-1-4"},
			{ id:12, pId:1, name:"父节点 1-2", open:false},
			{ id:121, pId:12, name:"叶子节点 1-2-1"},
			{ id:122, pId:12, name:"叶子节点 1-2-2"},
			{ id:123, pId:12, name:"叶子节点 1-2-3"},
			{ id:124, pId:12, name:"叶子节点 1-2-4"},
			{ id:13, pId:1, name:"父节点 1-3", open:false},
			{ id:131, pId:13, name:"叶子节点 1-3-1"},
			{ id:132, pId:13, name:"叶子节点 1-3-2"},
			{ id:133, pId:13, name:"叶子节点 1-3-3"},
			{ id:134, pId:13, name:"叶子节点 1-3-4"},
			{ id:14, pId:1, name:"父节点 1-3", open:false},
			{ id:135, pId:14, name:"叶子节点 1-3-1"},
			{ id:136, pId:14, name:"叶子节点 1-3-2"},
			{ id:137, pId:14, name:"叶子节点 1-3-3"},
			{ id:138, pId:14, name:"叶子节点 1-3-4"},
			{ id:15, pId:1, name:"父节点 1-3", open:false},
			{ id:139, pId:15, name:"叶子节点 1-3-1"},
			{ id:140, pId:15, name:"叶子节点 1-3-2"},
			{ id:141, pId:15, name:"叶子节点 1-3-3"},
			{ id:142, pId:15, name:"叶子节点 1-3-4"}
			];
			
	// 树菜单
	var zTree = $("#tree");
	zTree = $.fn.zTree.init(zTree, setting, treeNodes);
});
</script>
</head>

<body>
<div id="msg" style="background:#090; color:#FFF; height:20px; width:200px;"></div><br /><br />
<ul id="tree" class="ztree"></ul>
</body>
</html>

zTree 并没有专门针对 ul 这个容器做特殊的css 设置，因为大家需求都不一样，有的要固定高度，有的要自动适应。。。所以你需要自己根据自己的情况制作这个 ul 的样式

估计你的问题是出在这里

######能有什么变通办法得到高度自适应时ul的即时高斗数值吗？######

其实我也不是要固定高度，就是希望获取当前ul实际高度就行了，问题是好像是反着，展开ul高度变小了，收起就变大了

###### @zTree 请求帮助...

######

请你看看下拉菜单的 Demo， http://www.ztree.me/v3/demo.php#_507

去 demo.css 中把 ul.ztree 的 height: 360px; 样式去掉，你会发现div可以正常展开和收缩的，不会出现你说的情况。

######测试发现高度是在onClick事件操作之后变化的，所以在onClick事件里获取的都是高度变化之前的高度（即使获取高度代码放在事件最后执行）.... @ztree有没有点击之后的事件回调方法呢？###### @zTree 奇怪，上面的测试代码中也没有定义 ul 的高度呀，只是动态获取ul高度，怎么就出错了呢。。。。纠结！######expandNode 用的是动画效果的展开，所以是异步的操作。你这种情况只能是利用 onExpand 和 onCollapse 回调在展开折叠操作结束后再获取高度######回复 @akgen : 把展开、折叠的动画去掉就没事儿了######请问就上面这个代码如何能解决呢？

zTree高度不正确问题，展开父级菜单后整个容器高度反而变小了，如何解决？? 400 报错

容器服务

相关文章

热门讨论

热门文章