post Jquery Ajax 中的数据未按预期工作

Question

我想在 Jquery 的帮助下删除记录。获取行 ID 并删除该行。当我第一次单击按钮时，数据删除正常，但下次 jquery $.post 渲染中继器 table 时，删除功能无法正常工作。我找不到这个问题的原因。我的 jquery 代码

$(".delButton").click(function () {
        debugger;
        alert("delclick");
        var delID = $(this).parent().parent().children().html();
        $.post("CallBacks/AddProducts.aspx", { DeleteID : delID},
           function (data, status) {

                   debugger;
                   var start = data.indexOf("###Start###") + 11;
                   var end = data.indexOf("###End###");
                   var subdata= data.substring(start,end);
                   $("#productTbody").html(subdata);

               });
           });

我的转发器 table 形式主要 class 是：

  <tbody id="productTbody">

                    <asp:Repeater id="repeaterProducts" runat="server" >
                <ItemTemplate>
                    <tr>
                        <td ><%# Eval("id") %></td>
                        <td><%# Eval("Name") %></td>
                        <td><%# Eval("ColourName") %></td>
                        <td><%# Eval("GageName") %></td>
                        <td><%# Eval("Rate") %></td>
                        <td><input class="delButton" type="button" value="del"/></td>

                    </tr>
                </ItemTemplate>
            </asp:Repeater>  



                     </tbody>

第二次使用相同的中继器 class AddProducts

  ###Start###   
               <asp:Repeater id="repeaterProducts" runat="server" >
                <ItemTemplate>
                    <tr>
                        <td ><%# Eval("id") %></td>
                        <td><%# Eval("Name") %></td>
                        <td><%# Eval("ColourName") %></td>
                        <td><%# Eval("GageName") %></td>
                        <td><%# Eval("Rate") %></td>
                        <td><input class="delButton" type="button" value="del"/></td>

                    </tr>
                </ItemTemplate>
            </asp:Repeater>  

 ###End###

Answer 1

委托点击事件，而不是：

$(".delButton").click(function () {

做：

$(document).on('click', '#delButton', function () {

这样，事件就会绑定到文档，因此当您的元素被重新呈现时，它们仍然会被发现 - 您的点击将起作用。

post Jquery Ajax 中的数据未按预期工作

post data not working as expected in Jquery Ajax

asp.net

ajax

jquery

repeater