0

我有一个像这样生成的非常大的 html 表：

function getSpeciesRowHtml(row_data) {
    var html = "";
    html = html + '<tr>' +
    '<td>' + row_data.id + '<input type="hidden" class="species_table_IDs" value="' + row_data.id + '"></td>' +
    '<td>' + row_data.name + '</td>' +
    '<td>' + row_data.name_lat + '</td>' +
    '<td>' + row_data.class + '</td>' +
    '<td>' + row_data.family + '</td>' +
    '<td>' + row_data.family_lat + '</td>' +
    '<td>' + row_data.order + '</td>' +
    '<td>' + row_data.order_lat + '</td>' +
    '<td>' + row_data.spec_status + '</td>' +
    '<td><a class="btn_species_delete">Edit</a></td>' + //delete button
    '</tr>'
    ;
    return html;
}


function fillTable(data) {
    var html = "";
    $.each(data, function (i, item) {
        html = html + getSpeciesRowHtml(data[i],true);
    });
    $('#species_table tbody')
            .prepend($(html));
};

该表的数据通过控制器来自数据库。事实是数据可以被删除。为此，在表格的每一行中都有“删除”按钮。删除按钮由类选择器初始化，因为它们非常多（逐行创建表需要大量时间）：

$('.btn_species_delete')
        .button({ icons: { primary: "ui-icon-trash" }, text: false })
        .click(function () { DeleteSpecies(id); });

也就是说，当你按下“delete”函数时，必须调用其中应该引用的“id”属性。问题是每个按钮都有自己独特的“id”，我不知道如何将它转移到那里。因为按钮的初始化是通过整个类执行的。如何最好地处理这个问题，让它尽快工作？

4

2 回答 2

2

这样做会不会更容易：

$('#species_table .btn_species_delete')
    .button({ icons: { primary: "ui-icon-trash" }, text: false })
    .click(function () { 
        DeleteSpecies($(this).attr('id')); 
    });

$(this)正在引用被单击的按钮并.attr('id')获取它的 ID 值

希望这可以帮助。

查看以下链接了解更多信息：

http://learn.jquery.com/javascript-101/this-keyword/ - 解释$(this)

http://api.jquery.com/attr/ - 解释.attr()

编辑

所有这一切都假设按钮的 id 与行 id 相同：D 看到 Michaels 的回答并结合 2

于 2013-08-08T07:53:03.390 回答
1

为您添加一个数据属性<a>，例如

'<a class="btn_species_delete" data-rowid="'+row_data.id+'">'

然后在您的点击中：

DeleteSpecies($(this).attr('data-rowid'));
于 2013-08-08T07:54:24.120 回答