项目常用功能模块(4)-ztree树节点名称太长(动态控制)

上一篇,关于ztree节点数据过长的文章,不能动态控制,根据情况,自己又改进了下。

这一次的改进,包括:

一:根据ztree所在的区域长度以及节点的级数  动态 判断节点是否省略,不再写死。

二:新增了关于 节点数据 中,包含汉字和英文字母的判断,更加精确。

function addDiyDom(treeId, treeNode) {
		var ztreeWidth=$("#tree").css("width");
		ztreeWidth=parseInt(ztreeWidth);
		
		//默认ztree字体大小为12px,可以显示字节数(10代表ztree的padding,18代表图标宽度,每一级节点缩进16px)
		var num=parseInt((ztreeWidth-10-18*(treeNode.level+1)-16)/12*2);
		//判断 节点 字节数
		var spantxt=$("#" + treeNode.tId + "_span").html();
		if(spantxt){
			var txtLength=GetLength(spantxt);
		}
		//如果 节点数据长度大于允许长度,即将超出时
		var cutNum,cutLength=0;
		if(txtLength>num){
			for (var i = 0; i < spantxt.length; i++){  
		        var charCode = spantxt.charCodeAt(i); 
	        	if (charCode >= 0 && charCode <= 128){
	        		 cutLength += 1; 
	        	}else{
	        		cutLength += 2;
	        	}
	        	if(cutLength>=num-2){
        		 	cutNum=i;//找到刚符合 允许长度 的字符串的位置
        		 	break;
        		}
		    }  
			spantxt=spantxt.substring(0,cutNum)+"..."; 
			$("#" + treeNode.tId + "_span").html(spantxt);  
		}
		//判断 包含汉字和英文的字符串的长度判断方法,判断字节数
		function GetLength(str){  
		    var realLength = 0;  
		    for (var i = 0; i < str.length; i++){  
		        var charCode = str.charCodeAt(i);  
		        if (charCode >= 0 && charCode <= 128)   
		        realLength += 1;  
		        else   
		        realLength += 2;  
		    }  
		    return realLength;  
		}
    }


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值