Qt TableWidget 固定表头 实例
创始人
2024-08-02 05:30:25
0次

Qt TableWidget 固定表头 实例是本文要介绍的内容,使TableWidget  固定表头一个js插件的实例,先来看内容。

公司项目里面很多地方都需要用到,出列表的时候固定表头,滚动表体,思路就是动态创建一个div,然后里面创建2个div,一个title,一个body,然后用clone的方法,分别处理2个div的内容

使用说明:

  1. var tableWidget = new TableWidget("TableID", "DestID", "100%", "300px");  
  2. tableWidget.change(); 

表格需要固定宽度,table 需要加 style="table-layout: fixed;"

  1. /*  
  2. * 函数名称: Widget  
  3. * 作    者: yithcn  
  4. * 功能说明: 固定表格头,表体可以滚动  
  5. * 创建日期: 2010.10.13  
  6. */  
  7. function TableWidget(table, dest, width, height) {  
  8.     this.construct(table, dest, width, height);  
  9. };  
  10. TableWidget.prototype = {  
  11.     table: null,  
  12.     dest: null,  
  13.     widht: null,  
  14.     height: null,  
  15.     tdiv: null,  
  16.     bdiv: null,  
  17.     create: function() {  
  18.         var that = this;  
  19.         var div = document.createElement("div");  
  20.         div.style.cssText = "background-color:white;width:" + that.width;  
  21.         that.dest.appendChild(div);  
  22.         //title  
  23.         var titlediv = document.createElement("div");  
  24.         titlediv.style.cssText = "width:100%;";  
  25.         div.appendChild(titlediv);  
  26.         //body  
  27.         var bodydiv = document.createElement("div");  
  28.         bodydiv.style.cssText = "overflow:auto;height:" + that.height + ";";  
  29.         bodydiv.appendChild(that.table);  
  30.         div.appendChild(bodydiv);  
  31.         var newtable = that.table.cloneNode(true);  
  32.         var len = newtable.rows.length;  
  33.         for (var i = len - 1; i > 0; i--) {  
  34.             newtable.deleteRow(i);  
  35.         }  
  36.         titlediv.appendChild(newtable);  
  37.         that.table.deleteRow(0);  
  38.         that.tdiv = titlediv;  
  39.         that.bdiv = bodydiv;  
  40.     },  
  41.     construct: function(table, dest, width, height) {  
  42.         var that = this;  
  43.         window.onload = function() {  
  44.             if (table && typeof table == "string")  
  45.                 table = document.getElementById(table);  
  46.             if (dest && typeof dest == "string")  
  47.                 dest = document.getElementById(dest);  
  48.             else  
  49.                 dest = document.body;  
  50.             widthwidth = width || "100%";  
  51.             heightheight = height || "300px";  
  52.             height = parseInt(height) - table.rows[0].offsetHeight;  
  53.             that.table = table;  
  54.             that.dest = dest;  
  55.             that.width = width;  
  56.             that.height = height;  
  57.             that.create();  
  58.             that.change();  
  59.         }  
  60.     },  
  61.     change: function() {  
  62.         var that = this;  
  63.         if (that.table.offsetHeight > parseInt(that.height)) {  
  64.             that.tdiv.style.width = parseInt(that.bdiv.offsetWidth) - 16;  
  65.         }  
  66.         else {  
  67.             that.tdiv.style.width = parseInt(that.bdiv.offsetWidth);  
  68.         }  
  69.     }  
  70. }; 

之所以会有一个change方法,是因为在项目当中需要动态改变列表,要计算表头和表体滚动条。

小结:Qt TableWidget 固定表头 实例的内容介绍完了, 希望本文对你有所帮助!

相关内容

热门资讯

PHP新手之PHP入门 PHP是一种易于学习和使用的服务器端脚本语言。只需要很少的编程知识你就能使用PHP建立一个真正交互的...
网络中立的未来 网络中立性是什... 《牛津词典》中对“网络中立”的解释是“电信运营商应秉持的一种原则,即不考虑来源地提供所有内容和应用的...
各种千兆交换机的数据接口类型详... 千兆交换机有很多值得学习的地方,这里我们主要介绍各种千兆交换机的数据接口类型,作为局域网的主要连接设...
粉嫩如何诠释霸道 东芝M805... “霸道粉”是个什么玩意东芝M805拿过来的时候,笔者扑哧笑了,不是笑这款笔记本,而是笑这款产品的颜色...
什么是大数据安全 什么是大数据... 在《为什么需要大数据安全分析》一文中,我们已经阐述了一个重要观点,即:安全要素信息呈现出大数据的特征...
如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
全面诠释网络负载均衡 负载均衡的出现大大缓解了服务器的压力,更是有效的利用了资源,提高了效率。那么我们现在来说一下网络负载...
如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
30分钟搞定iOS自定义相机 最近公司的项目中用到了相机,由于不用系统的相机,UI给的相机切图,必须自定义才可以。就花时间简单研究...
Windows恶意软件20年“... 在Windows的早期年代,病毒游走于系统之间,偶尔删除文件(但被删除的文件几乎都是可恢复的),并弹...