Javascript代码停止在带有Update Panel的ASP.NET用户控件中工作

Question

我有一个Javascript代码，用于完整的gridview行，单击以选中同一行中的复选框 。 （放置在外部文件中）

  $(document).ready(function () {
                $('tr.dataRow').on('click', function () {
                    var checked = $(this).find('input[id*=chkBusinessSelected]').prop('checked');
                    $(this).find('input[id*=chkBusinessSelected]').prop('checked', !checked);

                });
        });

        var prm = Sys.WebForms.PageRequestManager.getInstance();

        prm.add_endRequest(function () {
            $('tr.dataRow').on('click', function () {
                var checked = $(this).find('input[id*=chkBusinessSelected]').prop('checked');
                $(this).find('input[id*=chkBusinessSelected]').prop('checked', !checked);

            });
        });

在用户控件后面的代码中

  protected void grdBusiness_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            e.Row.CssClass = "dataRow";
        }
    }

请注意，它们包含在“更新面板”中，以避免完全回发。 该功能用于在网格视图中多次选择一个项目。 一切正常，直到我在父页面中使用了User控件为止，在该页面中，该页面也具有Update Panel用法。

使用gridview行单击功能，然后单击用户控件外部的另一个按钮以处理某些内容。 再次使用或重复该功能时，我无法单击该复选框。 Javacript代码停止工作。

我尝试在父页面上删除UpdatePanel，并且它起作用了。 但是我需要在“用户控件”和“父页面”中都放置“更新”面板。

Answer 1

对于jQuery 1.7+，您可以使用.on（）将事件处理程序附加到父元素，然后将选择器与“ dataRow”组合作为参数传递。

参见http://api.jquery.com/on/

所以代替...

$('tr.dataRow').click( function() {
    // do something
});

你可以写...

$('body').on('click', 'tr.dataRow', function() {
    // do something
});

不是的，您也可以在$(document).ready(function () {之外写它。
如果您使用的是旧版本，则可以使用jQuery的.live()方法。

更多详细信息对动态创建的元素进行事件绑定？