Schleife durch jede HTML-Tabelle Spalte und Holen Sie sich die Daten mit jQuery

Question

Ich versuche, die Daten innerhalb der html <tbody> zu bekommen. Grundsätzlich habe ich viele Zeilen wie diese;

   <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> 

Nun, ich Schleife durch und versuchen, die <td> Werte wie diese zu erhalten;

 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 = ? 
      }); 
     }); 

Aber, ich bin nicht in der Lage, die Werte (HTML-Text) der jeweiligen Reihe zu bekommen. Ich möchte diese Werte lokalen Variablen zuweisen.
Auch ich mag nicht die innerHTML eine Taste bekommen (die in jeder Zeile ist)

Answer 1

Mit einem verschachtelten .each() bedeutet, dass Ihre innere Schleife ein td zu einer Zeit tut, so dass Sie nicht die productId und product und quantity alle in der inneren Schleife einstellen .

Sie sich auch function(key, val) und dann val[key].innerHTML ist nicht richtig: die .each() method gibt den Index (eine ganze Zahl) und das eigentliche Element, so dass Sie function(i, element) und dann element.innerHTML verwenden würden. Obwohl jQuery auch this auf das Element setzt, können Sie einfach this.innerHTML sagen.

Wie auch immer, hier ist ein Weg, um es an die Arbeit zu machen:

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/

Answer 2

Sie können mit textcontent versuchen.

var productId = val[key].textContent; 

Answer 3

versuchen diese

$("#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()) 
    }); 

Answer 4

Mein erster Beitrag ...

Ich habe versucht, dieses: change 'tr' für ‚td 'und Sie werden alle HTMLRowElements in ein Array und die Verwendung von textContent wird von Objekt in String

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); 
} 

Answer 5

Wenn Sie Ihre Tabelle erstellen, setzen Sie Ihre td mit 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