table中单元格td文字多余部分隐藏，与显示（测试正常）

2024年3月27日 114次阅读 来源: m0_54378125 
第一部分：
<style  
  table { 
    table-layout:fixed;
    }
</style>

第二部分(注意style中的内容)：
 <tr >
     <td >{
   { d.yf }}</td>
     <td class="text-left info"  style="text-overflow: ellipsis; white-space: nowrap;overflow: hidden ">{
   { d.plan_content }}</td>
     <td class="text-left info" style="text-overflow: ellipsis; white-space: nowrap;overflow: hidden ">{
   { d.work_progress}}</td>
     <td >{
   { d.start_time.strftime("%Y-%m-%d") }}</td>
     <td >{
   { d.finish_time.strftime("%Y-%m-%d") }}</td>
     <td >{
   { d.bz2.strftime("%Y-%m-%d") }}</td>
 </tr>

第三部分
    //鼠标移入单元格时，清除style
   $(function(){
    $("#myTable td").mouseover(function() {
         $(this).removeAttr( "style" );
     });
    //鼠标移出单元格时，增加style
    $("#myTable td").mouseout(function() {
         $(this).attr( "style",'text-overflow: ellipsis; white-space: nowrap;overflow: hidden' );
     });
    })

    原文作者：m0_54378125
    原文地址: https://blog.csdn.net/m0_54378125/article/details/123066638
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞