[英]Loop Through Each HTML Table Column and Get the Data using jQuery
i'm trying to get the data inside the html <tbody>
. 我正在尝试获取html
<tbody>
的数据。 Basically, i have many rows like this; 基本上,我有很多这样的行;
<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; 现在,我正在循环并试图获得像这样的
<td>
值;
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. 但是,我无法获得每行的值(html文本)。 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) 另外,我不想得到按钮的
innerHTML
(在每一行)
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
. 还使用
function(key, val)
然后使用val[key].innerHTML
不对: .each()
方法传递索引(整数)和实际元素,所以你要使用function(i, element)
然后是element.innerHTML
。 Though jQuery also sets this
to the element, so you can just say this.innerHTML
. 虽然jQuery也将
this
设置为元素,所以你可以说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/
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())
});
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将从Object变为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);
}
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);
}
});
您可以尝试使用textContent。
var productId = val[key].textContent;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.