javascript - 删除按钮不起作用

Question

HTML 表格:

<table width="100%" border="0" cellspacing="0" cellpadding="0" id="table-data">
        <tr>
            <td>Name</td>
            <td>Location</td>
            <td>From</td>
            <td>To</td>
            <td>Add</td>
        </tr>
        <tr class="tr_clone">
            <td><input type="text"  placeholder="who" name="who" /></td>
            <td><input type="text"  placeholder="location" name="location" /></td>
            <td><input type="text" placeholder="Start Date" name="datepicker_start" class="datepicker"/></td>
            <td><input type="text" placeholder="End Date" name="datepicker_end" class="datepicker"/></td>
            <td><input type="button" name="add" value="Add" class="tr_clone_add"/></td>
            <td><input type="button" value="Delete" onclick="deleteRow(this)"/></td>
        </tr>
    </table><!-- /table#table-data -->

Javascript:

$("input.tr_clone_add").live('click', function() {
    var $tr    = $(this).closest('.tr_clone');
    var $clone = $tr.clone();
    $clone.find(':text').val('');
    $tr.after($clone);
});

function deleteRow(r)
{
var i = r.parentNode.parentNode.rowIndex;
document.getElementById("table-data").deleteRow(i);
}

这是我的 fiddle :

http://jsfiddle.net/tejdeep/b6A9R/

此代码克隆表格行的前两个单元格。我为每一行添加和删除按钮。

我想要这样:

http://jsfiddle.net/nKkhW/5/

添加按钮应该在克隆行那里，删除按钮应该在克隆行那里。

我想在克隆前两个单元格值必须进入克隆行时包含该功能？

如果您对这个问题有疑问，请告诉我。

Answer 1

我对你的问题的理解，在此基础上我创建了 Fiddle .希望对您有所帮助，默认值除外。

Updated fiddle

要删除行，你可以尝试:

var $actualrow = $(this).closest('.tr_clone');
$actualrow.remove();