使用 jquery 根据他的数据设置最后一个 td 值答案

【问题标题】：Set the last td value on basis of his data using jquery使用 jquery 根据他的数据设置最后一个 td 值
【发布时间】：2015-05-12 02:56:03
【问题描述】：

我正在处理一个使用数据表创建的表。现在我想使用 jquery 设置最后一个 td 值。我尝试了不同的代码，但没有这样的运气。

<script type="text/javascript">
    $(document).ready(function() {

       $('#productsTable tr').each(function() {
           alert($(this).closest('tr').children('td.two').text());
           // alert($(this).closest('tr').find('td:eq(11)').text());
       });
    });
</script>

我没有得到 last td 的正确值。我的表格 html 是：

<table class="display table table-bordered table-striped dataTable" id="productsTable" aria-describedby="productsTable_info">
    <thead>
        <tr role="row">
            <th class="sorting_desc" tabindex="0" rowspan="1" colspan="1" aria-label="Date: activate to sort column ascending" style="width: 45.777777671814px;">Date</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Auction: activate to sort column ascending" style="width: 75.777777671814px;">Auction</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Bid no: activate to sort column ascending" style="width: 62.777777671814px;">Bid no</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending" style="width: 55.777777671814px;">Name</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Chassis No: activate to sort column ascending" style="width: 107.777777671814px;">Chassis No</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Year: activate to sort column ascending" style="width: 46.777777671814px;">Year</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Color: activate to sort column ascending" style="width: 53.777777671814px;">Color</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Mileage: activate to sort column ascending" style="width: 75.777777671814px;">Mileage</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Score: activate to sort column ascending" style="width: 58.777777671814px;">Score</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="Bid: activate to sort column ascending" style="width: 35.777777671814px;">Bid</th>
            <th class="sorting" tabindex="0" rowspan="1" colspan="1" aria-label="End Price: activate to sort column ascending" style="width: 95.777777671814px;">End Price</th>
            <th class="sorting_disabled" tabindex="0" rowspan="1" colspan="1" aria-label="Result" style="width: 63.777777671814px;">Result</th>
        </tr>
    </thead>
    <tbody role="alert" aria-live="polite" aria-relevant="all">
        <tr class="odd">
            <td class=" sorting_1">2015-05-08</td>
            <td class="">SAA Sapporo</td>
            <td class="">3005</td>
            <td class="">FIT SHUTTLE</td>
            <td class=""></td>
            <td class="">2012</td>
            <td class="">WHITE</td>
            <td class="">23</td>
            <td class="">4.5</td>
            <td class="">0</td>
            <td class="">0</td>
            <td class="">1</td>
        </tr>
        <tr class="even">
            <td class=" sorting_1">2015-05-08</td>
            <td class="">SAA Sapporo</td>
            <td class="">55097</td>
            <td class="">PIXIS EPOCH</td>
            <td class=""></td>
            <td class="">2012</td>
            <td class="">.....</td>
            <td class="">8</td>
            <td class="">4.5</td>
            <td class="">0</td>
            <td class="">0</td>
            <td class="">0</td>
        </tr>
    </tbody>
</table>

我正在尝试设置结果值，例如 if 1 then Winner 和 2 then losre 等，但问题是我没有得到 last td 的值。我做错了什么。

【问题讨论】：

标签： javascript jquery html datatables html-table

【解决方案1】：

您需要将:last 选择器与 td 元素对象一起使用：

$('#productsTable tr:has(td)').each(function() {
 alert($(this).find('td:last').text());
});

这将提醒 trs 中每个最后一个 td 元素的文本。

【讨论】：

你能在小提琴中重现吗？？
:last-child 是你想要的。 .last() 是一个 jQuery 函数
我认为databtable正在使用js创建可能是这样的效果吗？你的建议
查看演示 jsfiddle.net/vrw6t2md。当数据在数据表中呈现时，你也应该调用上面的代码，
当我更改为$('#productsTable tr:has(td)') 时，我没有收到任何警报或错误？

【解决方案2】：

由于你使用的是数据表，最好使用datatables api

$('#productsTable tbody tr td:last-child').each(function () {
    var cell = table.cell(this),
        data = cell.data();
    if (data == 1) {
        cell.data('Winner');
    } else if (data == 0) {
        cell.data('Lost');
    }
})

演示：Fiddle

【讨论】：

谢谢，但是当我在我这边运行您的代码时，它什么也不做。我对数据值发出警报但没有警报。我认为它不会进入代码内部。
我这样写代码：$(document).ready(function() { var table = $('#productsTable').DataTable(); $('#productsTable tbody tr td:last-child').each(function () { var cell = table.cell(this), data = cell.data(); alert(data); if (data == 1) { cell.data('Winner'); } else if (data == 0) { cell.data('Lost'); } }) });
对不起，第一个问题应该是如何将数据加载到表中......它是动态完成的......还是你有一个包含数据的普通表，然后将其转换为数据表