[英]Changing the background colour of a given row (onClick event) in a Dynamic table
我正在生成一个动态表,该表可以根据用户输入具有多个行。 当用户选择/单击任何行时,我想更改行的背景色。 我的代码看起来像:(注释的部分是我进行的试用,但是它们不起作用)
function Contact_OnUpdateTelephone() {
$('#tableTelephone > tbody > tr').remove();
for (var c = 0; c < _updatedTelephoneList.length; c++) {
var index = _updatedTelephoneList[c].Index;
var id = _updatedTelephoneList[c].Id;
$('#tableTelephone tbody:last').append("<tr onclick = GetTelephoneData(" + index + ",'" + id + "');><td>" + index + "</td><td>" + id + "</td></tr>");
}
}
function GetTelephoneData (index, id) {
//Change the color of the clicked (selected) row
// $("#tableTelephone tbody tr").removeClass("altcol_blue");
// $(this).addClass("altcol_blue");
// $("tr").click(function(){
// $(this).addClass("altcol_blue").siblings("tr").removeClass("altcol_blue");
// });
$("#tableTelephone tr td").live( 'click', function () {
$(this).addClass("altcol_blue").siblings("tr").removeClass("altcol_blue");
});
Var SelectedIndex = index;
...
...
}
我的CSS看起来像:
table.resulttable tr.altcol_blue td{ height:20px; font-family:Arial, Helvetica, sans-serif; font-weight:normal; color:#444444; font-size:11px; background-color:#deedf5; vertical-align:middle; padding-left:5px;}
根据您的帖子,我想您想知道如何更改背景颜色。
如果您只想高行排行我这里的一个主意:
$("#tableTelephone tr td").each(function () {
if ($(this).parent().hasClass("altcol_blue") == false)
{
$("#tableTelephone tr").removeClass("altcol_blue");
$(this).parent().addClass("altcol_blue");
}
});
这种方法背后的想法是,确保从旧行中删除类“ altcol_blue”。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.