jquery - 清除行中的值并模拟单击它

Question

我正在向表中动态添加一行，并且需要在其后执行两件事:

1. 清除值

2. 模拟点击新创建的链接(该链接位于其中一个单元格中)。

以下是将行添加到表中的代码(工作正常):

var row = $('.records_table tbody>tr:last').clone(true);
row.insertAfter('.records_table tbody>tr:last');

我的行 html 代码如下所示:

<tr class=​"odd">​
   <td class=​"name">​name_0</td>​
   <td class=​"type">​type_0​</td>​
   <td class=​"value">​value_0</td>​
   <td class=​"edit">​
       <a href=​"edit" class=​"edit">​edit​</a>​
   </td>​
</tr>​

所以，我的第一个问题:如何清除值 name_0、type_0 和 value_0？

现在，第二个问题。我需要模拟单击链接“edit”，以便触发链接到选择器“a.edit”的事件(对于加载了页)。 我可以通过 var editbtn = $("td:last", row) 获取按钮。我可以通过 editbtn.hide() 隐藏链接，但执行 editbtn.click() 不会按预期触发事件。

应该获得点击的处理程序是:$(document).on('click', 'a.edit', function(e) {，它再次处理其他链接在其他行中。

有什么想法吗？

Answer 1

你可以这样遍历它

var row = $('.records_table tbody>tr:last').clone(true);
row.insertAfter('.records_table tbody>tr:last');
$('.records_table tbody>tr:last') // gets last tr
    .find('td') // gets all td
    .not('.edit') // not the td with class=edit
    .text('') // make all text empty
    .end() // go back to first selector
    .find('a.edit').click(); // find anchor within tr and trigger click 

http://jsfiddle.net/59hyL/1/

如果你想点击最后一个td而不是 anchor ..你可以这样做

$('button').click(function() {
    var row = $('.records_table tbody>tr:last').clone(true);
    row.insertAfter('.records_table tbody>tr:last');
    $('.records_table tbody>tr:last')
        .find('td')
        .not('.edit')
        .text('');        
    $('tbody td:last').click();
});

$('.records_table').on('click', 'td.edit', function(e) {
    e.preventDefault();
    console.log("anchor number " + $('td.edit').index(this) + 'clicked');
});​

http://jsfiddle.net/hEP5q/