如何使用jQuery获取表格单元格值？
我正在试图找出如何使用jQuery获取每行的表格单元格的值。
我的表看起来像这样：
<table id="mytable"> <tr> <th>Customer Id</th> <th>Result</th> </tr> <tr> <td>123</td> <td></td> </tr> <tr> <td>456</td> <td></td> </tr> <tr> <td>789</td> <td></td> </tr> </table> 我基本上想循环遍历表，并获取每行的Customer Id列的值。
在下面的代码中，我已经计算出需要这样做来让它循环遍历每一行，但我不知道如何获得行中第一个单元格的值。
$('#mytable tr').each(function() { var cutomerId = }
如果可以的话，可能值得在包含客户ID的TD上使用类属性，这样你可以写：
$('#mytable tr').each(function() { var customerId = $(this).find(".customerIDCell").html(); });
从本质上讲，这与其他解决scheme（可能是因为我copypasted）是一样的，但具有如下优点：如果围绕列移动，或者甚至将客户ID放入<span中，则不需要更改代码的结构>，只要你保持它的类属性。
顺便说一句，我认为你可以在一个select器中做到这一点：
$('#mytable .customerIDCell').each(function() { alert($(this).html()); });
如果这使事情变得更容易
$('#mytable tr').each(function() { var customerId = $(this).find("td:first").html(); });
你正在做的是循环遍历表中的所有trs，在循环中find当前tr中的第一个td，并提取它的内部html。
要select特定的单元格，可以使用索引引用它们：
$('#mytable tr').each(function() { var customerId = $(this).find("td").eq(2).html(); });
在上面的代码中，我将检索第三行的值（索引是从零开始的，所以第一个单元格索引将是0）
以下是如何在没有jQuery的情况下做到的：
var table = document.getElementById('mytable'), rows = table.getElementsByTagName('tr'), i, j, cells, customerId; for (i = 0, j = rows.length; i < j; ++i) { cells = rows[i].getElementsByTagName('td'); if (!cells.length) { continue; } customerId = cells[0].innerHTML; }
一个不太古怪的方法：
$('#mytable tr').each(function() { if (!this.rowIndex) return; // skip first row var customerId = this.cells[0].innerHTML; });
这显然可以改变为与非第一个单元格一起工作。
尝试这个，
$(document).ready(function(){ $(".items").delegate("tr.classname", "click", function(data){ alert(data.target.innerHTML);//this will show the inner html alert($(this).find('td:eq(0)').html());//this will alert the value in the 1st column. }); });
$('#mytable tr').each(function() { // need this to skip the first row if ($(this).find("td:first").length > 0) { var cutomerId = $(this).find("td:first").html(); } });
这工作
$(document).ready(function() { for (var row = 0; row < 3; row++) { for (var col = 0; col < 3; col++) { $("#tbl").children().children()[row].children[col].innerHTML = "H!"; } } });
是不是你使用该列的ID？ 比如说：
<table width="300" border="1"> <tr> <td>first</td> </tr> <tr> <td>second</td> </tr> <tr> <td>blah blah</td> <td>blah blah</td> <td id="result">Where the result should occur</td> </tr> </table> <script type="text/javascript"> $('#result').html("The result is...."); </script>
尝试这个 ：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled</title> <script type="text/javascript"><!-- function getVal(e) { var targ; if (!e) var e = window.event; if (e.target) targ = e.target; else if (e.srcElement) targ = e.srcElement; if (targ.nodeType == 3) // defeat Safari bug targ = targ.parentNode; alert(targ.innerHTML); } onload = function() { var t = document.getElementById("main").getElementsByTagName("td"); for ( var i = 0; i < t.length; i++ ) t[i].onclick = getVal; } </script> <body> <table id="main"><tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> </tr><tr> <td>5</td> <td>6</td> <td>7</td> <td>8</td> </tr><tr> <td>9</td> <td>10</td> <td>11</td> <td>12</td> </tr></table> </body> </html>
一个工作示例： http : //jsfiddle.net/0sgLbynd/
<table> <tr> <td>0</td> <td class="ms-vb2">1</td> <td class="ms-vb2">2</td> <td class="ms-vb2">3</td> <td class="ms-vb2">4</td> <td class="ms-vb2">5</td> <td class="ms-vb2">6</td> </tr> </table> $(document).ready(function () { //alert("sss"); $("td").each(function () { //alert($(this).html()); $(this).html("aaaaaaa"); }); });
$(document).ready(function() { var customerId $("#mytable td").click(function() { alert($(this).html()); }); });
