Question

嗨我有一个下表输出数据行。每行旁边都有一个删除按钮。

           <form>
             <table id="tblAppendGrid" class="appendGrid">
                <thead class="ui-widget-header">
                <tbody class="ui-widget-content">
                <tr id="tblAppendGrid_Row_1">
                <td><input type="text" id="tblAppendGrid_s_1" name="nameCompany"    maxlength="100" style="width: 160px;"></td>
                <td><button id="tblAppendGrid_Delete_1" class="delete ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" value="2" type="text" title="Remove Current Row" tabindex="-1" role="button" aria-disabled="false"></td>
                <tr id="tblAppendGrid_Row_2">
               <td><input type="text" id="tblAppendGrid_s_2" name="nameCompany" maxlength="100" style="width: 160px;"></td>
               <td><button id="tblAppendGrid_Delete_2" class="delete ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" value="2" type="text" title="Remove Current Row" tabindex="-1" role="button" aria-disabled="false"></td>
           </tbody>
           <tfoot class="ui-widget-header">
           </table>
        </form>

我在点击删除按钮时尝试读取一行。如下面的代码我不知道如何选择按钮ID旁边的行号。因为它不起作用。

      $(document).ready(function () {

           $("#tblAppendGrid_Delete_").button().click(function () {

                        testing("in delete");
                    });    
       });

我想我需要选择器就像$（“tblAppenDGrid_Delete_2”）。 ... 请让我知道如何在按钮单击上选择此行，以便我可以将其删除。谢谢

Answer 1

这里有两个问题

元素的ID必须是唯一的，您有多个ID为tblAppendGrid_Delete_的元素，在这种情况下，您可以使用类值对所有删除按钮进行分组，而不是ID属性。

<button class="tblAppendGrid_Delete_1 delete ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" value="2" type="text" title="Remove Current Row" tabindex="-1" role="button" aria-disabled="false">

由于您可能正在处理动态元素，因此需要使用基于事件委派的事件处理程序

$(document).on('click', ".tblAppendGrid_Delete_", function () {
    testing("in delete");
});

选择要删除的动态生成的行

1 个答案: