jQuery for html table根据其他单元格值更改单元格内容

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery for html table根据其他单元格值更改单元格内容相关的知识,希望对你有一定的参考价值。

我有一个类似于此的表,但有许多行:

<table width=400px id=mytable>
 <tr>
  <td>test one</td>
  <td>yes</td>
  <td>success</td>
 </tr>
 <tr>
  <td>test two</td>
  <td>yes</td>
  <td>none</td>
 </tr>
</table>

这些值由数据库动态填充。如果每行中的第二个td的值为yes,那么如何将第3个td的值更改为“正在进行中”?值为yes,因为用户已提交测试但测试正在进行中,并且td3的值为none,直到数据库填充td3。

我有这个jquery我用过,但它只是搜索和替换基于单元格的文本,而不是说下一个单元格。

$(function() {
    $('#mytable td').each(function() {
        var html = $(this).html();
        $(this).html(
        html.replace(/0/,'<b>success</b>')
             .replace(/1/,'<b>failed</b>')
        );
    });
});

我也一直在玩这个代码,但这不符合我想做的事情,因为它只根据.eq(x)的位置更新某些TD。

$(document).ready(function() {
    $('#mytable').find('td').eq(4).text('changeme');
});

我的桌子可以有大约20行,我想在我的桌子中的每个第二个td这样做

理想情况下,我想要一个悸动,但一旦我能解释第二个td值,这应该是可能的。

答案

此代码将通过td,查看单元格是否具有值“none”,如果是,则将下一个单元格的值设置为“正在进行”:

$(function() {
    $('#mytable td').each(function() {
        var html = $(this).html();
        if (html == "none")
            $(this).next().html("in progress");
        });
});

根据以下评论更新了代码:

$(document).ready(function() {
    $('td').each(function() {
        if ($(this).html() == "yes" && $(this).next().html() == "none") {
            $(this).next().html("in progress");
        }
    });
});
另一答案

试试这个

$('#mytable td').each(function() {
    var html = $(this).html();
    if(html === 'none'){
        $(this).next('td').text('in progress');
}
});

见工作fiddle

另一答案

检查这个Fiddle

$(function() {
    var secondCells = $('tr').find('td:eq(1)');
    console.log(secondCells)
    $.each(secondCells, function(i) {
        if( $(this).text() == 'none'){
            console.log($(this).next())
           $(this).next().text('Processing..');
        }
    });
});​
另一答案

此示例将遍历行中的每个第二个td,如果值为“none”,则将下一个单元格替换为“正在进行中”:

$("#mytable td:nth-child(2)").each(function(index, elem)
{
    if($(elem).html() === "none")
    {
        $(elem).next().html("in progress")
    }
});​

jsFiddle

另一答案
$('table tr').each(function(){
    $('td:eq(1):contains(yes)', this).next().text('in progress')
})

http://jsfiddle.net/CYdVs/

另一答案

你可以用each()运行一个循环,用它运行一个计数器,每次检查计数器是偶数还是奇数。

CSS-Tricks.com : Check if even or odd

不过,肯定有更好的方法。

以上是关于jQuery for html table根据其他单元格值更改单元格内容的主要内容,如果未能解决你的问题,请参考以下文章

C# 如何把一个table的行填充到另一个table

django 管理后台 table使用jquery怎么实现的

Jquery让table行根据单元格值变色

jquery

求助Bootstrap table,根据行数据选中行~ 求助

利用JS如何遍历table 如何用JS向td中写入内容