繁体   English   中英

jQuery事件不适用于异步回发,固定于第二次回发,于第三次中断

[英]JQuery event not working on async postback, fixing on 2nd postback, breaking on 3rd

这是我页面的简化版本:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
    <script language="javascript" type="text/javascript">
        var cbFuncInit = function() {
            $('div').click(function(evt) {
                if (evt.target.type !== 'checkbox') {
                    var checkbox = $(':checkbox', this);
                    checkbox.attr('checked', !checkbox.attr('checked'));
                    evt.stopPropagation();
                    return false;
                }
            });
        };

        $(document).ready(function() {
            cbFuncInit();
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <div id="myDiv" style="background-color:red;height:50px;width:50px;">
        <asp:checkbox ID="Checkbox1" runat="server" ></asp:checkbox>
    </div>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>    
            <asp:Repeater ID="Repeater1" runat="server">
            <ItemTemplate>
                <div id="myDiv" style="background-color:red;height:50px;width:50px;">
                <asp:checkbox ID="Checkbox1" runat="server"></asp:checkbox>
            </div>
            </ItemTemplate>
            </asp:Repeater>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Button1"/>
        </Triggers>
    </asp:UpdatePanel>

    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
    </form>
</body>
</html>

以下是简化的代码:

protected void Button1_Click(object sender, EventArgs e)
{
    var list = new List<string> { "", "", "" };
    Repeater1.DataSource = list;
    Repeater1.DataBind();
    ScriptManager.RegisterStartupScript(Page, Page.GetType(), "", "cbFuncInit();", true);
}

这是问题所在:

该页面允许您单击div以便单击其嵌套的复选框。 但是,当回退到更多复选框时,然后使用ScriptManager.RegisterStartupScript重新绑定事件时,原始div不再是可单击的,而新div是...

但是(变得更好)...

当您再次单击按钮时,所有div现在都可以单击...

可是等等...

当您再次单击该按钮时,第一个div再次变为不再可单击。

有人知道为什么吗? 我想知道它是否与JQuery的event object有关 不幸的是,我的JavaScript调试技能在这里有些无法比拟。

我不确定在不查看页面的实际版本的情况下是怎么回事,但是当您重新绑定事件时,似乎发生了某种冲突。

您可以尝试的一件事是:

  • 首先用jQuery 1.3替换jQuery 1.2.6
  • 然后将$('div').click(function(evt){//function code here})替换$('div').live('click',function(evt){//function code here})

完成此操作后, 无需使用ScriptManager.RegisterStartupScript重新绑定事件,因为事件将通过委派来捕获。 继续通过回发添加新的复选框,事件将自动绑定...

希望能解决您的问题...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM