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")
}
});
另一答案
$('table tr').each(function(){
$('td:eq(1):contains(yes)', this).next().text('in progress')
})
另一答案
你可以用each()运行一个循环,用它运行一个计数器,每次检查计数器是偶数还是奇数。
CSS-Tricks.com : Check if even or odd
不过,肯定有更好的方法。
以上是关于jQuery for html table根据其他单元格值更改单元格内容的主要内容,如果未能解决你的问题,请参考以下文章
django 管理后台 table使用jquery怎么实现的