ASP.NET回发后关闭jQuery Modal对话框将再次打开该对话框



我有一个HTML链接,它打开了一个包含iFrame的jQuery模态对话框。此iFrame包含一个表单,该表单应在回发后关闭对话框(OkCancel)。

在我的回发中,我向iFrame添加了一个Javascript函数来关闭对话框,它运行良好。但问题是,当用户按下OkCancel按钮后,对话框会关闭并再次打开!我做错了什么?

这是我的代码:

调用HTML页面:

<html>
<head>
    <link rel="stylesheet" type="text/css" href="theme/south-street.css" media="screen" id="themeCSS" />
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#dlgConfirm").dialog({
                autoOpen: false,
                resizable: false,
                modal: true,
                width: 550,
                height: 300,
                close: function (event, ui) { alert('closed') }
            })
        });

        function fConfirm(tId) {
            alert('ddd');
            $('#dlgConfirm').children().attr('src', 'ConfirmTracking.aspx?tId=' + tId)
            .load(function () {
                $("#dlgConfirm").dialog('open');
            });
            return false;
        }
    </script>
</head>
<body>
    <div style="display: none">
        <div id="dlgConfirm" title="Confirm Tracking" style="padding: 0px">
            <iframe style="margin: 0px; padding: 0px" marginheight="0" marginwidth="0" src="" width="100%" height="100%" frameborder="0"></iframe>
        </div>
    </div>
    <a href="#" onclick="return fConfirm('109')">Click me</a>
</body>
</html>

iFrame页面

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ConfirmTracking.aspx.cs" Inherits="Chicken.ConfirmTracking" %>
<html>
<head runat="server">
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript">
        function CloseThis() {
            parent.$('#dlgConfirm').dialog('close');
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <br />
        <asp:TextBox ID="edtTrackingNo" runat="server"></asp:TextBox>
        <br /><br />
    <asp:Button ID="btnOk" runat="server" Text="Ok" />
    <asp:Button ID="btnCancel" runat="server" onclick="Cancel_Click" Text="Cancel" />
    </form>
</body>
</html>

iFrame Codebehind:

using System;
namespace Chicken {
    public partial class ConfirmTracking: System.Web.UI.Page {
        protected void Page_Load(object sender, EventArgs e) {
        }
        protected void Cancel_Click(object sender, EventArgs e) {
            ClientScript.RegisterClientScriptBlock(this.GetType(), "none", "<script>$(function(){CloseThis()});</script>");
        }
    }
}

我设法跟踪了您的问题,function fConfirm(tId)中的加载在关闭对话框后再次触发。这似乎是个bug。解决这个问题的一种混乱方法是在页面中添加一个全局变量,并将其设置为true,以显示对话框是通过函数打开的,然后在打开对话框之前,如果变量为true,则打开对话框。不要忘记再次将变量设置为false,以便在需要时重新打开对话框。

您的功能如下所示:

    var loadedByFunction = false;
    function fConfirm(tId) {
        loadedByFunction = true;
        $('#dlgConfirm').children().attr('src', 'ConfirmTracking.aspx?tId=' + tId)
        .load(function () {
            if (loadedByFunction) {
                loadedByFunction = false;
                $("#dlgConfirm").dialog('open');
            }
        });
        return false;
    }

最新更新