jq控制表格里的文字大小 超过隐藏 鼠标移上去提示

本文介绍了两种实现表格中内容超出部分隐藏的方法:一是通过CSS样式控制文本内容超出时隐藏并使用省略号显示;二是利用jQuery判断文本长度超过指定长度时进行截断,并在鼠标悬停时显示完整内容作为提示。

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

方法一:

设置css样式


tr td{

	/* 下面是设置文本内容超出隐藏不换行的 */
	word-break:keep-all;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
     }


table{
      table-layout:fixed;
}


方法二:

jq控制表格里的文字大小 超过隐藏 鼠标移上去提示

超过隐藏 判断长度

鼠标移上去提示  加标题title


   var odiv= $("#odiv").html();
    if(odiv.length > 5){
	 $("#odiv").attr("title",odiv);
	 $("#odiv").html(odiv.substring(0,5)+"...");
    }else{
	 $("#odiv").html(odiv);
    }
		

<table>
  <tr>
     <td><div id="odiv">这是是文字哦哦哦哦哦哦哦哦哦哦哦哦</div></td>
  </tr>
</table>



评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值