精华内容
下载资源
问答
  • js合并列
    2021-08-31 11:03:39

     
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
    <HTML> 
    <HEAD> 
    <TITLE> New Document </TITLE> 
    <META NAME="Generator" CONTENT="EditPlus"> 
    <META NAME="Author" CONTENT=""> 
    <META NAME="Keywords" CONTENT=""> 
    <META NAME="Description" CONTENT=""> 
    </HEAD> 
    <SCRIPT LANGUAGE="JavaScript"> 
    function autoRowSpan(tb, row, col) {

    let lastValue = '';

    let value = '';

    let pos = 1;

    const listTable = document.getElementById(tb); // 根据table表格id获得要合并的表格

    for (let i = row; i < listTable.rows.length; i++) {

    value = listTable.rows[i].cells[col].innerText;

    if (lastValue === value) {

    listTable.r

    更多相关内容
  • js 合并列

    2014-06-16 12:22:35
     // 逐检查合并 for (i = 0; i ; i++) { if(i == 1){ continue; } if (i == colLength) { return; } obj1 = document.getElementById("tb__0_" + i.toString()); for (j = 1; j ; j+...
    function uniteTable(tb, colLength) {  
               //   检查表格是否规整  
    if (!checkTable(tb)) {
    return;
    }
    var i = 0;
    var j = 0;
    var k = 0;
    var rowCount = tb.rows.length; //   行数  
    var colCount = tb.rows[0].cells.length; //   列数  
    var obj1 = null;
    var obj2 = null;  
               //   为每个单元格命名  
    for (i = 0; i < rowCount; i++) {
    for (j = 0; j < colCount; j++) {
    tb.rows[i].cells[j].id = "tb__" + i.toString() + "_" + j.toString();
    }
    }  
               //   逐列检查合并  
    for (i = 0; i < colCount; i++) {
    if(i == 1){
    continue;
    }
    if (i == colLength) {
    return;
    }
    obj1 = document.getElementById("tb__0_" + i.toString());
    for (j = 1; j < rowCount; j++) {
    obj2 = document.getElementById("tb__" + j.toString() + "_" + i.toString());
    if (obj1.innerText == obj2.innerText) {
    obj1.rowSpan++;
    obj2.parentNode.removeChild(obj2);
    } else {
    obj1 = document.getElementById("tb__" + j.toString() + "_" + i.toString());
    }
    }
    tb.style.display = "block";
    /*for(k=1;k < rowCount;k++){
    //alert("dfff");
    tb.rows[k].style.display = "block";
    }*/

    }
    }  
                
     /
     //   功能:检查表格是否规整
     //   参数:tb--需要检查的表格ID
     //   data:   2005.11.6  
     /  
    function checkTable(tb) {
    if (tb.rows.length == 0) {
    return false;
    }
    if (tb.rows[0].cells.length == 0) {
    return false;
    }
    for (var i = 0; i < tb.rows.length; i++) {
    if (tb.rows[0].cells.length != tb.rows[i].cells.length) {
    return false;
    }
    }
    return true;
    }
    展开全文
  • /*合并指定表格(表格id为table_id)指定数为table_colnum)的相同文本的相邻单元格 param:table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data param:table_...

    1)方法:

     /*合并指定表格列(表格id为table_id)指定列(列数为table_colnum)的相同文本的相邻单元格
            param:table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data
            param:table_colnum 为需要合并单元格的所在列。为数字,从最左边第一列为1开始算起。*/
            function table_rowspan(table_id, table_colnum) {
                var table_firsttd = "";
                var table_currenttd = "";
                var table_SpanNum = 0;
                var table_Obj = $(table_id + " tr th:nth-child(" + table_colnum + ")");
                table_Obj.each(function (i) {
                    if (i == 0) {
                        table_firsttd = $(this);
                        table_SpanNum = 1;
                    } else {
                        table_currenttd = $(this);
                        //alert($(this).attr('value'));
                        if (table_firsttd.text() == table_currenttd.text()) { //这边注意不是val()属性,而是text()属性
                            //td内容为空的不合并
                            if (table_firsttd.text() != "") {
                                table_SpanNum++;
                                table_currenttd.hide(); //remove();
                                table_firsttd.attr("rowSpan", table_SpanNum);
                            }
                        } else {
                            table_firsttd = $(this);
                            table_SpanNum = 1;
                        }
                    }
                });
            }
    
    
            /*合并指定表格行(表格id为table_id)指定行(行数为table_rownum)的相同文本的相邻单元格
            param:table_id 为需要进行合并单元格的表格id。如在HTMl中指定表格 id="data" ,此参数应为 #data
            param:table_rownum 为需要合并单元格的所在行。其参数形式请参考jquery中nth-child的参数。
              如果为数字,则从最左边第一行为1开始算起。
              "even" 表示偶数行
              "odd" 表示奇数行
              "3n+1" 表示的行数为1、4、7、10.......
            param:table_maxcolnum 为指定行中单元格对应的最大列数,列数大于这个数值的单元格将不进行比较合并。
              此参数可以为空,为空则指定行的所有单元格要进行比较合并。*/
            function table_colspan(table_id, table_rownum, table_maxcolnum) {
                if (table_maxcolnum == void 0) { table_maxcolnum = 0; }
                var table_firsttd = "";
                var table_currenttd = "";
                var table_SpanNum = 0;
                $(table_id + " tr:nth-child(" + table_rownum + ")").each(function (i) {
                    table_Obj = $(this).children();
                    table_Obj.each(function (i) {
                        if (i == 0) {
                            table_firsttd = $(this);
                            table_SpanNum = 1;
                        } else if ((table_maxcolnum > 0) && (i > table_maxcolnum)) {
                            return "";
                        } else {
                            table_currenttd = $(this);
                            if (table_firsttd.text() == table_currenttd.text()) {
                                //td内容为空的不合并
                                if (table_firsttd.text() != "") {
                                    table_SpanNum++;
                                    table_currenttd.hide(); //remove();
                                    table_firsttd.attr("colSpan", table_SpanNum);
                                    table_firsttd.attr("style", "text-align:center");
                                }
                            } else {
                                table_firsttd = $(this);
                                table_SpanNum = 1;
                            }
                        }
                    });
                });
            }

    2)调用

    table_rowspan("#tab1", 1); //合并第一列
    table_rowspan("#tab1", 2);//合并第二列
    table_rowspan("#tab1", window.scope.HeadColumnList.length);//合并最后列
    table_colspan("#tab1", 1);//合并第一行
    table_colspan("#tab1", 2);//合并第二行

    展开全文
  • 要求效果 一开始一直没想到咋写,因为数据格式项名称是一个数组,脑袋转不过来,不知道循环第二个数组时如何还让第一个循环正常走; 解决: let totalIndex = 1; for (var i = 0; i < listOld.length;...

    要求效果在这里插入图片描述
    一开始一直没想到咋写,因为数据格式项名称是一个数组,脑袋转不过来,不知道循环第二个数组时如何还让第一个循环正常走;
    解决:

    let totalIndex = 1;
    var htmlList="";
     for (var i = 0; i < listOld.length; i++) {
            var item = listOld[i];
            for (var j = 0; j < item.DeductPointList.length; j++) {
                if (j == 0) {
                    htmlList += '<tr>';
                    htmlList += '<td>' + totalIndex + '</td>';
                    htmlList += '<td rowspan="' + item.DeductPointList.length + '">' + item.DeductItemName + '</td>';//这里重点
                    htmlList += '<td>' + item.DeductPointList[j].DeductPoint + '</td>'; 
                    htmlList += '<td class="score_td">-' + item.DeductPointList[j].Score + '</td>';
                    htmlList += '<td><span class="cz_bj" οnclick="addNew(' + item.DeductItem_Code + ')">编辑</span><span class="cz_sc" οnclick="deteleFun(' + item.DeductItem_Code + ',' + item.DeductPointList[j].DeductPointCode+')">删除</span></td>';
                    htmlList += '</tr>';
                }
                else {
                    htmlList += '<tr>';
                    htmlList += '<td>' + totalIndex + '</td>';
                    htmlList += '<td>' + item.DeductPointList[j].DeductPoint + '</td>';
                    htmlList += '<td class="score_td">-' + item.DeductPointList[j].Score + '</td>';
                    htmlList += '<td><span class="cz_bj" οnclick="addNew(' + item.DeductItem_Code + ')">编辑</span><span class="cz_sc" οnclick="deteleFun(' + item.DeductItem_Code + ',' + item.DeductPointList[j].DeductPointCode +')">删除</span></td>';
                    htmlList += '</tr>';
                }
                totalIndex++;
            }
        }
        $('#contentBox tbody').html(htmlList)
    
    展开全文
  • eg: 1 function hbh() { 2 var tab = document.getElementById("tableID"); 3 var maxCol = 2, val, count, start, qycol = 1, valqy; //maxCol:合并单元格作用到多少,valqy...
  • js合并列

    千次阅读 2013-02-20 17:46:17
    合并单元格要求: ...3、仅合并列 4、仅合并行      //功能:合并表格  //参数:tb-需要合并的表格ID  //参数:colLength--需要对前几列进行合并,比如,  //想合并前两列,后面的数据列忽
  • spreadjs_包含合并列头的数据绑定-demo (1)
  • RowspanTooljs实现table行合并组件 支持多、多维、不规则顺序、指定起始行默认配置tbody:'tbody',//表jq选择器tr:'tr',//行jq选择器td:'td',//单元格jq选择器startRow:0,//起始行(0则自动获取) 起始值:1endRow:0...
  • test.rar,colUnion.js,colm2.html
  • 前两天有几个小伙伴找我问我关于js-xlsx导出时合并单元格的问题,因为小伙伴需要导出的效果都不太一样,所以我在这里对其解决思路简单的给讲一下,大家根据实际情况自行修改。 1.通过导入获取头JSON数据 其实...
  • 动态生成表格,并自动合并相同单元格插件,可在bootstrapTable子表使用
  • 前端:JS中表格合并单元格(

    千次阅读 2020-11-11 10:40:56
    * 列合并单元格(如果结束行传0代表合并所有行) * @param table 表格的ID * @param startRow 起始行 * @param endRow 结束行 * @param col 合并号,对第几列进行合并(从0开始)。第一行从0开始 */ function ...
  • <template> <div> <el-dialog width="40%" :visible.sync="hdVisible"> <div slot="title" class="dialog-title">...i class="el-icon-warning-outline">...{{ helpData.n.
  • element-plus 合并列 合并行
  • 相邻表格相同数据看起来不好看,而且显得冗余,如果将相邻表格的相同数据进行合并处理,不仅看起来美观很多,而且显得更加的专业。
  • js列合并处理

    2018-09-03 16:18:36
    * 列合并工具类 * 调用eg : fnMergeRowCell($("[name=maintbody]"), [0, 1, 2], 0); * maintbodyObj : 需要合并列的表格对象(tbody),必填 * limitRowOrRowIndexs : 需要合并,必填 * ...
  • 本文实例为大家分享了Vue Elenent实现表格相同数据列合并的具体代码,供大家参考,具体内容如下 作者:秋名 思路:后台查询表格数据,查询出来后直接传到前端,前端通过foreach循环,然后对相同的表格进行合并。(同...
  • Oracle 查询合并列

    2021-05-08 04:18:51
    在ORACLE查询时,有时要将多个列合并成一行,其方法如下:1.decode函数decode函数的语法为:decode(条件,值1,返回值1,值2,返回值2,...值n,返回值n,缺省值)或 decode(条件,值1,返回值1,返回值2,...值n,返回值n,缺省值...
  • vue使用el-table动态合并列及行  本文实例为大家分享了vue使用el-table动态合并列及行的具体代码,供大家参考,具体内容如下 前两天项目中需要用到表单合并,特此记录,放便以后使用。 首先我使用的element-ui中...
  • <!DOCTYPE html> <html lang="en"> <head> ...meta charset="UTF-8">...script type="text/javascript" src="./jquery-1.7.2.min.js" charset="UTF-8"></script> <style> t
  • el-table表格合并行、合并列

    千次阅读 2022-06-22 16:14:06
    }} </template> </el-table-column> </el-table> </div> </div> </template> <script> //这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等) //例如:import 《组件名称》 from '...
  • 代码如下: function hb(){ var tab = document.getElementById(“subtable”); var maxCol = 3, val, count, start; var ys=””; for(var col = maxCol-1; col >= 0 ;... i<tab xss=removed> 1){ //合并 sta
  • <script src="http://code.jquery.com/jquery-2.1.4.min.js"> 隐藏1 <td>2 <td>123 <td>123 <td>123 隐藏2 <td>3 <td>123 <td>123 <td>123 隐藏2 <td>3 ...
  • 主要介绍了JS实现动态修改table及合并单元格的方法,结合完整实例形式分析了JS动态遍历及修改table单元格的具体操作技巧,需要的朋友可以参考下
  • element+vue项目中 table 表格需要先合并第一的数据在合并第二的数据 思路: 数据添加两个rowspan(rowspan_D , rowspan_B)(设备编号 , 操作批次) 合并第一例的多行数据 (rowspan_D ) 第一相同的...
  • 记录一下首次合并表格。 遇到了很多坑,这是解决后的代码 ui的设计图(也是最终效果啦) element 的table: <div class="category"> <el-table :data="alldata" :span-method="arraySpanMethod...
  • table合并列

    2020-03-30 11:06:27
    import React, { useState, useEffect, useRef } from 'react'; import { Table, Button, Tooltip, Modal, } from 'antd'; const Index = () => { const listData = [{ skuId: '143621', ...
  • 表格行列合并JS

    2013-01-09 16:47:49
    //函数说明:合并指定表格(表格id为_w_table_id)指定数为_w_table_colnum)的相同文本的相邻单元格 //参数说明:_w_table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #...
  • element使用表格合并列

    2022-08-15 17:00:07
    element表格合并列
  • layui数据表格合并列

    千次阅读 2022-01-12 16:16:23
    //合并列名称 var columsIndex = [0,1]; //合并列索引值 for (var k = 0; k ; k++) { //循环所有要合并的列 var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行 for (var i = 1; i ; i++) { //...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 55,342
精华内容 22,136
关键字:

js合并列