根据页面像素宽度截取标题长度

本文介绍了一种使用JavaScript来动态截断和显示主题名称的方法,以适应网页元素的宽度限制。通过定义`chlength`函数计算字符串长度,并根据最大允许字节数截断文本,确保了即使禁用了JavaScript也能正常显示部分内容。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

下面是js控制代码

function chlength(sString,maxByte){
var sStr,iCount,i,strTemp,result ;
iCount = 0 ;
sStr = sString.split("");
for (i = 0 ; i < sStr.length ; i ++){
if(iCount < maxByte){
strTemp = escape(sStr[i]);
if (strTemp.indexOf("%u",0) == -1)
{
iCount = iCount + 1 ;
}else{
iCount = iCount + 2 ;
}
}else{
return i ;
}
}
return i ;
}

$(document).ready(function(){
//本次消费时间为47ms 大量使用将导致性能下降 慎用
$(".zhuanti").each(function(){
var topic_name = $(this).attr("title");
var count = chlength(topic_name,25);
var result = topic_name.substr(0,count);
$(this).html(result);
});
});

页面内容为

<span class="zhuanti" title="${fn:escapeXml(cur.topic_name)}">${fn:substring(fn:escapeXml(cur.topic_name), 0, 12)}</span>

写上${fn:substring(fn:escapeXml(cur.topic_name), 0, 12)}时因为为了遵守js渐进增强,防止用户禁用JavaScript

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值