遍历每个HTML表列并使用jQuery获取数据

i'm trying to get the data inside the html <tbody>. Basically, i have many rows like this; 遍历每个HTML表列并使用jQuery获取数据

我正在尝试获取html 中的数据。基本上，我有很多这样的行;

                <tbody>
                    <tr>
                        <td>63</td>
                        <td>Computer</td>
                        <td>3434</td>
                        <td>
                            <button class="btn-medium btn-danger remove" id="mprDetailRemove"><i class="icon-remove"></i></button>
                        </td>
                    </tr>
                    <tr>
                        <td>64</td>
                        <td>Stationary</td>
                        <td>111</td>
                        <td>
                            <button class="btn-medium btn-danger remove" id="Button1"><i class="icon-remove"></i></button>
                        </td>
                    </tr>
                    <tr>
                        <td>64</td>
                        <td>Stationary</td>
                        <td>11</td>
                        <td>
                            <button class="btn-medium btn-danger remove" id="Button2"><i class="icon-remove"></i></button>
                        </td>
                    </tr>
                </tbody>

Now, i'm looping through and trying to get the <td> values like this;

现在，我在遍历并且试图得到像这样的值;

        var table = $("#mprDetailDataTable table tbody");

        table.find('tr').each(function (key, val) {
            $(this).find('td').each(function (key, val) {
                var productId = val[key].innerHTML; // this isn't working
                var product = ?
                var Quantity = ?
            });
        });

But, i'm not able to get the values(html text) of the each row. I want to assign these values to local variables.
Also, i don't want to get the innerHTML of a button (which is in each row)

但是，我无法获得每一行的值(html文本)。我想把这些值赋给局部变量。另外，我不想获取按钮的innerHTML(位于每行中)

5 个解决方案

#1

Using a nested .each() means that your inner loop is doing one td at a time, so you can't set the productId and product and quantity all in the inner loop.

使用嵌套的.each()意味着您的内部循环每次执行一个td，因此不能在内部循环中设置productId、product和quantity。

Also using function(key, val) and then val[key].innerHTML isn't right: the .each() method passes the index (an integer) and the actual element, so you'd use function(i, element) and then element.innerHTML. Though jQuery also sets this to the element, so you can just say this.innerHTML.

还使用函数(key, val)和val[key]。innerHTML并不正确:.each()方法通过索引(一个整数)和实际的元素，因此您将使用函数(i，元素)和元素。innerHTML。虽然jQuery也将它设置为元素，所以您可以直接输入this. innerhtml。

Anyway, here's a way to get it to work:

不管怎样，有一个方法可以让它工作:

    table.find('tr').each(function (i, el) {
        var $tds = $(this).find('td'),
            productId = $tds.eq(0).text(),
            product = $tds.eq(1).text(),
            Quantity = $tds.eq(2).text();
        // do something with productId, product, Quantity
    });

Demo: http://jsfiddle.net/bqX7Q/

演示:http://jsfiddle.net/bqX7Q/

#2

try this

试试这个

    $("#mprDetailDataTable tr:gt(0)").each(function () {
        var this_row = $(this);
        var productId = $.trim(this_row.find('td:eq(0)').html());//td:eq(0) means first td of this row
        var product = $.trim(this_row.find('td:eq(1)').html())
        var Quantity = $.trim(this_row.find('td:eq(2)').html())
    });

#3

My first post...

我的第一个帖子…

I tried this: change 'tr' for 'td' and you will get all HTMLRowElements into an Array, and using textContent will change from Object into String

我尝试这样做:将“tr”改为“td”，您将把所有HTMLRowElements都放入一个数组，使用textContent将从对象变为字符串

var dataArray = [];
var data = table.find('td'); //Get All HTML td elements

// Save important data into new Array
for (var i = 0; i <= data.size() - 1; i = i + 4)
{
  dataArray.push(data[i].textContent, data[i + 1].textContent, data[i + 2].textContent);
}

#4

You can try with textContent.

你可以试试textContent。

var productId = val[key].textContent;

#5

-1

When you create your table, put your td with class = "suma"

创建表时，将td与class = "suma"放在一起

$(function(){   

   //funcion suma todo

   var sum = 0;
   $('.suma').each(function(x,y){
       sum += parseInt($(this).text());                                   
   })           
   $('#lblTotal').text(sum);   

   // funcion suma por check                                           

    $( "input:checkbox").change(function(){
    if($(this).is(':checked')){     
        $(this).parent().parent().find('td:last').addClass('suma2');
   }else{       
        $(this).parent().parent().find('td:last').removeClass('suma2');
   }    
   suma2Total();                                                           
   })                                                      

   function suma2Total(){
      var sum2 = 0;
      $('.suma2').each(function(x,y){
        sum2 += parseInt($(this).text());       
      })
      $('#lblTotal2').text(sum2);                                              
   }                                                                      
});

Ejemplo completo

比如completo

#1