2

我对网络开发非常陌生。我目前正在使用tablesorter jquery 插件来创建一个动态表,用户可以在其中添加和删除行。单击时更改创建行的背景颜色时遇到问题。它适用于在 html 中硬编码的行。以下是相关代码:

$(document).ready(
    function() {
        $('table.tablesorter td').click(
            function (event) {
                $(this).parent('tr').toggleClass('rowclick');
                $(this).parent('tr').siblings().removeClass('rowclick');
        });
    }
)

rowclick 是一个 CSS 类:

table.tablesorter tbody tr.rowclick td {
    background-color: #8dbdd8;
}

我尝试将以下内容添加到添加新行的 Javascript 函数中:

var createClickHandler = 
        function(newrow) {
            return function(event) {
                //alert(newrow.cells[0].childNodes[0].data);
                newrow.toggleClass('rowclick');
                newrow.siblings().removeClass('rowclick');
            };
        }
row.onclick = createClickHandler(row);

当我单击新行时,警报会正确显示该行第一列中的文本。但是,我的新行不响应 CSS 类。有人有想法么?

我还应该提到,在应用 clickHandler 之前,我已经更新了 tablesorter:

$("#TASKTABLE").trigger("update");
$("#TASKTABLE").trigger("appendCache");
4

2 回答 2

0

委托您的可点击td元素,例如:

$('table.tablesorter').on('click','td', function(){

.on()从 jQuery 1.7 开始使用:

从 jQuery 1.7 开始,.on() 方法提供了附加事件 > 处理程序所需的所有功能。有关从旧的 jQuery 事件方法转换的帮助,请参阅 .bind()、.delegate()、> 和 .live()。要删除与 .on() 绑定的事件,请参阅 .off()。要附加一个仅运行一次然后自行删除的事件,请参阅 .one()

于 2012-06-28T21:16:45.283 回答
0

试试这个:

$(newrow).toggleClass('rowclick');
$(newrow).siblings().removeClass('rowclick');
于 2012-06-28T21:17:46.173 回答