使用类在两个td之间插入文本，Jquery不起作用

Question

我正在尝试使用Ajax和jQuery从PHP获取数据，并使用ClassName在两个TD之间插入。
T1 .... T6是班级名称
预期输出：

    t1  t2 t3  t4    t5   t6
A   10  20  30  40   50   60 
B   20  20  10  20   20   10 
C   10  20  20  20   20   50

实际输出：

  Bot_Code t1   t2  t3  t4   t5  t6
        A   10  20  20  20   20   50
        B   10  20  20  20   20   50
        C   10  20  20  20   20   50

html：

<table id="table">
<tr>
<td>
</td>
</tr>
<tr>
<th>
<span style="margin-right:150px">Bottle Name</span>
<span class="d5">Bottle Size</span>
<span class="d6">Bottle Type</span>
<span class="d1">Opening</span>
<span class="d2">Inward</span>
<span class="d3">Outward</span>
<span class="d4">Closing</span></th>
</tr>
<?php 
while($row_list=mysql_fetch_array($list)) 
{?>
<tr>
<td><a class="product" href="" myval="<?php echo $row_list['Bot_Code'];?>"><?php echo $row_list['Bot_Code'];?></a></td>
<td class="t5"><?php echo $row_list['Bot_Size'];?></td>
<td class="t6"><?php echo $row_list['Bot_Type'];?></td>
<td class="t1"></td>
<td class="t2"></td>
<td class="t3"></td>
<td class="t4"></td>
</tr>
<?php 
}?>
</tr>
<tr><td></td></tr>
</table>

jQuery：

<script>
$('document').ready(function(){
$('a').click(function(){
      var node=$(this);
    var item = node.attr('myval');  
  $.post('month_copy.php', {"bcode":item}, function(data){
  var products = data.split("|");
 $(".t1").text(products[0]);
 $(".t2").text(products[1]);
 $(".t3").text(products[2]);
 $(".t4").text(products[3]) ;
 }); 
});  
$('a').trigger('click');
});
</script>

现在，它显示了每一行的更新值。我认为有问题。我试图找出不起作用。请提前建议我。

Answer 1

您可以做类似的事情 -

node.parents('tr').children('.t1').text(products[0]);

尽管您可以通过添加行ID来优化HTML，但您可以调整该行以进行更优化

Answer 2

假设您的#table.t1实际上是#table .t1（额外空间）。

您需要指定要更改的行。

$("#table .t1").text("xx")

将更改所有元素，其中#table class t1 - 即所有第一列（如您所发现的）。

您需要的是：

thisRow.find(".t1").text("xx")

IE仅在当前行中找到T1，您可以使用以下操作：

var row = $(this).closest("tr");

'this'是单击的元素，即a，给您：

$('a').click(function() {
    var node = $(this);
    var row = node.closest("tr");
    var item = node.attr('myval');  
    $.post('month_copy.php', {"bcode":item}, function(data) {
        var products = data.split("|");
        row.find(".t1").text(products[0]);
        row.find(".t2").text(products[1]);
        ...
    }); 
});