jquery - 未捕获的 RangeError : Maximum call stack size exceeded, Chrome JS 错误

Question

我知道这是由我的js内部的无限循环引起的，但我无法解释为什么。我想单击一行来触发同一行上的按钮。我正在尝试以下 JQuery，但是当我单击一行时，我最终会在行单击函数内陷入无限循环。这是为什么？

$(document).on('pageinit', function (event) {
    bindRowClick();
});

function bindRowClick() {
    $('.orderTable').find('tr').click(function () {
        var btnView = $(this).find('td.tdViewOrder').find('input[type=submit]:first');
        btnView.trigger("click");
    });
}

我有一张 table ，上面有 class=".orderTable" <tbody> 内有一个中继器

<tbody>
   <asp:Repeater ID="rptrOrderView" runat="server" OnItemDataBound="rptrOrderView_ItemDataBound" OnItemCommand="rptrOrderView_ItemCommand">
      <ItemTemplate>
           <tr class="hand">
              <td class="title">
                  <asp:Label runat="server" ID="lblTdOrderNum"></asp:Label>
              </td>
              <td class="tdViewOrder">
                  <asp:Button runat="server" ID="btnViewOrder" Text="View" CssClass="btnViewOrder" SkinID="btnViewMiniB" CommandName="ViewOrder" />
              </td>
           </tr>
      </ItemTemplate>
   </asp:Repeater>
</tbody>

我知道这是一个很常见的问题，但我仍然没有解决我的问题。

解决方案

我已添加event.stopPropagation();到我的点击处理程序，现在正在工作。

$(document).on('pageinit', function (event) {
    bindRowClick();
    $('.btnViewOrder').click(function (event) {
        event.stopPropagation();
    });
});

Answer 1

这绝对是因为 btnView.click 向上传播并最终触发 tr 的点击事件 - 导致整个事件循环进行。

您需要做的是从 btnView 的点击处理程序中调用 event.stopPropagation() (问题中没有)。