使用jquery或javascript从表列中计算重复值，并传递给rowspan [英] count duplicate value from table column using jquery or javascript and pass to rowspan

问题描述

我想计算表列中的重复值，并使用 javascript 或 rowspan > jQuery 。

  $（document）.ready（function（）{
 
 var myarry = []; 
 
 var el = {}; 
 
 $（ tbody tr）。each（function（）{
 
 var row = $（this）.nextAll（）; 
 var first = row.find（'td'）。eq（0）.text（）; 
 var second = row.find （'td'）。eq（1）.text（）; 
 var third = row.find（'td'）。eq（2）.text（）; 
 if（el [first +第二+第三]]} {
 myarry.push（el）; 
 
} else {
 var c =（parseInt（myarry.length）+ parseInt（1））; 
 
 console.log（c）; 
 
 row.find（'td'）。eq（3）.attr（ rowspan，2）; 
 
 el [第一+第二+第三] = 1； 
 
 myarry = []; 
 
} 
 
 
}） ; 
 
}）； 
  

解决方案

下面是使用jQuery的示例，下面我将给出解释：

  $（document）.ready（function（）{
 let tr = $（'tr'）; 
 let vals = []; 
 
 tr.each（function（）{
 
 let td = $（this）.find（'td'）; 
 td.each（function（）{
 let val = $（this）.text（）; 
 if（isNaN（val））{
 return; 
} 
 else {
 let obj = _.find（ vals，elt => elt.number === val）; 
 if（obj）{
 obj.count + = 1; 
} 
 el se {
 vals.push（{
 number：val，
 count：1 
}）; 
} 
} 
}）； 
}）； 
 
让finalArr = []; 
 
 vals.forEach（function（elt）{
 let count = elt.count; 
 let num = elt.number; 
 $（'tr'）。 each（function（）{
 let td = $（this）.find（'td'）; 
 td.each（function（）{
 let val = $（this）.text （）; 
 if（$。inArray（val，finalArr）=== -1&&！isNaN（val）&&！ ; val === elt.number）{
 finalArr.push（val）; 
 $（this）.parent（'tr'）。append（`< td class ='added'rowspan = $ {count}> $ {count}< / td>`）; 
 
} 
 else {
 return; 
} 
}） ; 
}）; 
}）; 
 
}）； 
  

我们首先可以在每个表数据中创建一个唯一值数组。如果存在唯一值，则将其添加到vals数组中，该数组将存储表示唯一数字和 count（即它出现的次数）的对象。如果我们在迭代过程中再次看到该数字，我们将增加计数。遍历每一行之后，我们创建一个最终数组。然后，我们遍历val，并检索其发生的次数并将其存储在 count变量中。然后，我们再次遍历每个表行和表数据元素，如果数字是唯一的，则将当前计数添加到当前正在迭代的数组的父元素中（如果它等于我们正在操作的当前数字）在vals数组中打开，该数组存储我们之前创建的对象。最后，我们只是将一个表数据元素附加到要处理的行数等于其计数的元素的父表行中，然后可以插入该值多少次。当然，如果您不想插入值，则只需将表数据元素的内部文本保留为空白。

I want to count duplicate value from table column and pass to rowspan using javascript or jQuery.

$(document).ready(function(){

    var myarry =[];

    var el = {};

    $("tbody tr").each(function() {

        var row = $(this).nextAll();
        var first = row.find('td').eq(0).text();
        var second =row.find('td').eq(1).text();
        var third = row.find('td').eq(2).text();
        if(el[first + second + third]) {
            myarry.push(el);

        }else {       
            var c = (parseInt(myarry.length) + parseInt(1));

            console.log(c);

            row.find('td').eq(3).attr("rowspan",2);

            el[first + second + third] = 1;

            myarry =[];

        }


    });

});

here what i want in actual

解决方案

Here is an example using jQuery and I will give an explanation below it:

$(document).ready(function() {
    let tr = $('tr');
    let vals = [];

    tr.each(function() {

        let td = $(this).find('td');
        td.each(function() {
            let val = $(this).text();
            if(isNaN(val)) {
                return;
            }
            else {
                let obj = _.find(vals, elt => elt.number === val);
                if(obj) {
                    obj.count += 1;
                }
                else {
                    vals.push({
                        number: val,
                        count: 1
                    });
                }
            }
        });
    });

    let finalArr = [];

    vals.forEach(function(elt) {
        let count = elt.count;
        let num = elt.number;
        $('tr').each(function() {
            let td = $(this).find('td');
            td.each(function() {
                let val = $(this).text();
                if($.inArray(val, finalArr) === -1 && !isNaN(val) && !$(this).hasClass('added') && val === elt.number) {
                    finalArr.push(val);
                    $(this).parent('tr').append(`<td class='added' rowspan=${count}>${count}</td>`);

                }
                else {
                    return;
                }
            });
        });
    });

});

We can first create an array of unique values that are within each table data. If there is a unique value, we will add it to the vals array which will store objects representing the number that is unique and the "count" which is the number of times it occurs. If we see that number again during iteration, we will add to the count. After we are done iterating through each row we create a final array. We then iterate through our vals and retrieve the number of times it occurs and store it in the "count" variable. We then iterate through each table row and table data element again, and if the number is unique, we add that count the current count to parent element of the array we are currently doing iteration on if it is equal to the current number we are operating on in the vals array that stores the objects we created earlier. Lastly, we simply append a table data element to the parent table row of the element we are working with a rowspan that is equal to our count, and we can insert the value for how many times that number occurs. Of course, if you don't want to insert a value, you can simply keep the inner text of the table data element blank.

这篇关于使用jquery或javascript从表列中计算重复值，并传递给rowspan的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！