我有一个表格,它是页面上十几个表格中的一个,每次按下下一个或上一个按钮时都会重新加载。我需要能够根据变量值更改行的背景。下面是我的html和js ( css是由tablesorter插件控制的,但我已经用基本的js重写了它来改变整个背景,但不能只改变我想要的行
$("#inv3").tablesorter({ sortList: [[8,0]] });
....
for(var x=0;x<data.QID.length;x++)
if (data.QISBN != null ) {
//code
$("#inv3").show();
$("#inv3").append('<tr><td id=tableQtyApp>'+data.QApQty[x]+'</td><td id=tableDueDate>'+data.QDateDue[x]+'</td><td id=tableGuide>'+data.QGuide[x]+
'</td><td id=tableQtyUpd>'+data.QUpdateQty[x]+'</td><td id=tableQty>'+data.Qqty[x]+'</td><td id=tableMonth>'+data.QMonth[x]+
'</td><td id=tablePrice>'+data.QPrice[x]+'</td><td id=tableSource>'+data.QSource[x]+'</td><td id=tableDate>'+data.QDateQuote[x]+
'</td><td id=tableQID>'+data.QID[x]+'</td></tr>');
}
else if (data.QISBN == null ) {
$("#inv3").hide();
}
<table id="inv3" class="tablesorter" style="border: 1px solid black;">
<caption class="cap">Quotes</caption>
<thead>
<tr>
<th>Q APP</th>
<th>Due</th>
<th>Guide</th>
<th>Qty Up</th>
<th>Qty</th>
<th>Month</th>
<th>Price</th>
<th>Source</th>
<th>Date</th>
<th>ID</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
如果我使用js内置的datatable函数,如下所示,它工作得很好,但当我点击next按钮或previous按钮时,因为它没有重新加载屏幕,只是更新表,所以我得到了一个错误,我不想使用datatable函数,因为它会导致太多错误
$('#inv3').dataTable( {
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
if ( aData[3]==null )
{
$('td', nRow).css('background-color', '#FFC0CB' );
}
else if ( aData[3] ==0 )
{
$('td', nRow).css('background-color', '#FFC0CB');
}
else if ( aData[3]-aData[4] <0 )
{
$('td', nRow).css('background-color', '#FFC0CB');
}
}
} );
发布于 2018-10-16 03:28:14
在构建HTML时,包括表格单元格的背景颜色。如下所示:
function getStyle(val) {
switch (val) {
case null:
case <= 0:
return 'background-color: #FFC0CB';
default:
return '';
}
}
$("#inv3").append('<tr>' +
'<td id=tableQtyApp style="' + getStyle(data.QApQty[x]) + '">' +
data.QApQty[x] + ... +
'</td></tr>'
);
https://stackoverflow.com/questions/52821189
复制相似问题