回发后Jquery Click事件不起作用

Question

脚本：

 $(document).ready(function() {
        $('#<%=txtfranchisecode.ClientID %>').change(function() {

            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "CreditLimit.aspx/databind",
                data: '{Code: ' + $('#<%=txtfranchisecode.ClientID%>').val() + '}',
                dataType: "json",
                success: function(data) {

                    for (var i = 0; i < data.d.length; i++) {

                        $('#<%=tbDetails.ClientID %>').append("<tr><td><b>Name:</b></td><td>" + data.d[i].Name + "</td></tr><tr><td><b>Address:</b></td><td>" + data.d[i].Address + "</td></tr><tr><td><b>phone:</b></td><td>" + data.d[i].Phone + "</td></tr><tr><td><b>Email:</b></td><td>" + data.d[i].Email + "</td></tr><tr><td><b>Branch:</b></td><td>" + data.d[i].branch + "</td></tr>");


                    }
                    $('#<%=panel.ClientID %>').dialog("open");
                },
                error: function(result) {
                    alert("Error");
                }
            });

        });

    });

我在我的页面上使用了更新面板。它在我第一次使用时工作但在回发后不工作（在文本框更改事件之后我有一些服务器端计算）

通过谷歌我得到了这个链接Click me，我试过了，但没用 我该怎么办？

已编辑：尝试使用“Amresh Kumar Singh”解决方案

<script>
    $(function() {
        $('#<%=panel.ClientID %>').dialog({
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "explode",
                duration: 1000
            },
            buttons: [{
                text: "Ok",
                click: function() {
                    $(this).dialog("close");
                }
}]
        });



    });
</script>
<script>
  function BindData() {

        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "CreditLimit.aspx/databindbyId",
            data: '{Code: ' + $('#<%=ddlname.ClientID%>').val() + '}',
            dataType: "json",
            success: function(data) {

                for (var i = 0; i < data.d.length; i++) {

                    $('#<%=tbDetails.ClientID %>').append("<tr><td><b>Name:</b></td><td>" + data.d[i].Name + "</td></tr><tr><td><b>Address:</b></td><td>" + data.d[i].Address + "</td></tr><tr><td><b>phone:</b></td><td>" + data.d[i].Phone + "</td></tr><tr><td><b>Email:</b></td><td>" + data.d[i].Email + "</td></tr><tr><td><b>Branch:</b></td><td>" + data.d[i].branch + "</td></tr>");


                }
                $('#<%=panel.ClientID %>').dialog("open");
            },
            error: function(result) {
                alert("Error");
            }
        });
    }

C#：

 protected void Page_Load(object sender, EventArgs e)
    {
        ddlname.Attributes.Add("OnChange", "BindData();");
    }

第一次运行良好，但下一次抛出异常：

Error: cannot call methods on dialog prior to initialization; attempted to call method 'open'

Answer 1

King Fisher 你不能让它工作，因为文档准备在加载过程中只调用一次，所以我们可以在每个页面加载时加载 jquery 函数

将你的 jquery 函数放入函数中

<script>
function MainFunction(){
 $('#<%=txtfranchisecode.ClientID %>').change(function() {

            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "CreditLimit.aspx/databind",
                data: '{Code: ' + $('#<%=txtfranchisecode.ClientID%>').val() + '}',
                dataType: "json",
                success: function(data) {

                    for (var i = 0; i < data.d.length; i++) {

                        $('#<%=tbDetails.ClientID %>').append("<tr><td><b>Name:</b></td><td>" + data.d[i].Name + "</td></tr><tr><td><b>Address:</b></td><td>" + data.d[i].Address + "</td></tr><tr><td><b>phone:</b></td><td>" + data.d[i].Phone + "</td></tr><tr><td><b>Email:</b></td><td>" + data.d[i].Email + "</td></tr><tr><td><b>Branch:</b></td><td>" + data.d[i].branch + "</td></tr>");


                    }
                    $('#<%=panel.ClientID %>').dialog("open");
                },
                error: function(result) {
                    alert("Error");
                }
            });

        });
}

</script>

并在您的后端页面加载中添加此代码

ScriptManager.RegisterStartupScript(this, this.GetType(), GetUID(), "MainFunction();", true);

此功能也在后端aspx页面中，用于每次生成新密钥

  public string GetUID()
    {
        return Guid.NewGuid().ToString("N");
    }

Answer 2

您的代码结构不太清楚，但您可能需要再次调用 javascript。将上面的 JavaScript 放在一个函数中，然后在回发调用它后放在 C# 中。

ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "Init", " MyFunction();", true);'

Answer 3

您应该创建一个 Javascript 函数并在文本框更改时绑定。

<script>
function BindData(){
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "CreditLimit.aspx/databind",
            data: '{Code: ' + $('#<%=txtfranchisecode.ClientID%>').val() + '}',
            dataType: "json",
            success: function(data) {

                for (var i = 0; i < data.d.length; i++) {

                    $('#<%=tbDetails.ClientID %>').append("<tr><td><b>Name:</b></td><td>" + data.d[i].Name + "</td></tr><tr><td><b>Address:</b></td><td>" + data.d[i].Address + "</td></tr><tr><td><b>phone:</b></td><td>" + data.d[i].Phone + "</td></tr><tr><td><b>Email:</b></td><td>" + data.d[i].Email + "</td></tr><tr><td><b>Branch:</b></td><td>" + data.d[i].branch + "</td></tr>");
              }
                $('#<%=panel.ClientID %>').dialog("open");
            },
            error: function(result) {
                alert("Error");
            }
        });
    }

</script>

现在在页面加载事件上绑定BindData()函数如下：

txtfranchisecode.Attributes.Add("OnChange", "BindData();");

Answer 4

在部分回发后 DOM 不会重新加载，因此不会再次触发文档就绪功能。您需要分配一个部分回发处理程序。

类似这样的：

<asp:UpdatePanel ID="UpdatePanel1" runat="server" OnLoad="UpdatePanel1_Load">
    <ContentTemplate>
        <!-- Contents... -->
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="ReloadThePanel" EventName="Click" />
    </Triggers>
</asp:UpdatePanel>