住每个jquery？

Question

<table style="width: 50%" id="myTable">
 <tbody>
 <tr><td>Row 1</td><td>dd</td><td>red</td><td>dd</td></tr>
 <tr><td>Row 2</td><td>dd</td><td>green</td><td>dd</td></tr>
 <tr><td>Row 3</td><td>dd</td><td>red</td><td>dd</td></tr>
 </tbody>
</table>
<a href="#" name="addRow">Add Row</a>

$(document).ready(function () {        
       $("a[name=addRow]").click(function() {
                $("table#myTable tr:last").after('<tr><td>Row 4</td><td>dd</td><td>red</td><td>dd</td></tr>');
                return false;
        });

    $('#myTable tbody tr td').each(function()
{
    if ($(this).text() == 'red')
    {
        $(this).parent().css('background-color', 'red');
    }
    else if ($(this).text() == 'green')
    {
        $(this).parent().css('background-color', 'green');
    }
});

 });

为什么如果我添加新行，那么这不起作用？我尝试添加live：

$('#myTable tbody tr td').live('each', function()

但这也不起作用

现场：http://jsfiddle.net/pytP2/

Answer 1

live会将处理程序附加到指定元素的所有现有和未来实例的特定事件，这与您尝试执行的操作不同，因为您需要更新添加的新元素的样式到桌子。 live仅在您想为表格中的每个新行添加“点击”事件时才有用。

要修复代码，您需要在添加每个新元素后调用样式更新功能，这里有一个可用的演示 - http://jsfiddle.net/ipr101/zDvAQ/1/

Answer 2

这有效：

$(document).ready(function () {        

$("a[name=addRow]").click(function() {
    $("table#myTable tr:last").after('<tr><td>Row 4</td><td>dd</td><td>red</td><td>dd</td></tr>');
    initRow($("table#myTable tr:last"));
    return false;
});

$('#myTable tbody tr').each(function()
{
    initRow($(this));
});

function initRow(row)
{
    row.find('td').each(function(){
        var self = $(this);
        var textInTD = $.trim(self.text());
        if (textInTD == 'red')
        {
            row.css('background-color', 'red');
            return false;
        }
        else if (textInTD == 'green')
        {
            row.css('background-color', 'green');
            return false;
        }
    })
}
});

如果需要，我可以在代码中添加注释。

Answer 3

live将事件类型（例如'click'）作为第一个参数。见http://api.jquery.com/live/

Answer 4

这不起作用，因为onload代码只被触发一次：on load ...

如果您希望在添加新行后执行代码，请将所需代码提取到新函数中，并在添加新行后调用它

如果你担心性能（如果表格变得非常大），你也可以将新行传递给函数。