jQuery对话框立即关闭

本文关键字：对话框 jQuery | 更新日期: 2023-09-27 18:06:25

我有一个jQuery对话框，打开后立即关闭。它被设置为一个按钮，位于GridView的模板字段中。

我的JavaScript: 

<script type="text/javascript">
    $(document).ready(function() {
        $("#txtBeginDate").datepicker();
        $("#txtEndDate").datepicker();
        $("#response").dialog({
            autoOpen: false,
            modal: true,
            title: "Equifax Response"
        });
        $("[id*=lnkEquifaxResponse]").live("click", function EquifaxResopnse() {
            $("#response").dialog("open");
        });
    });
</script>

我的相关GridView标记:

<div id="Gridview">
    <asp:GridView ID="grClientTransactions" runat="server" AllowPaging="True" 
        PageSize="25" AutoGenerateColumns="False" DataKeyNames="ResponseXML"
        EmptyDataText="Record not found." EmptyDataRowStyle-BackColor="#CCCCCC" 
        EmptyDataRowStyle-Font-Bold="true" CssClass="mGrid" 
        PagerStyle-CssClass="pgr" AlternatingRowStyle-CssClass="alt" 
        OnPageIndexChanging="grClientTransactions_PageIndexChanging" 
        onrowcommand="grClientTransactions_RowCommand">
        <Columns>
            <asp:TemplateField ShowHeader="false">
                <ItemTemplate>
                    <asp:LinkButton ID="lnkEquifaxResponse" runat="server" 
                        CausesValidation="False"
                        CommandName="EquifaxResponse" 
                        Text="View" 
                        CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>'>
                    </asp:LinkButton>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField Visible="false" HeaderText="Equifax Response">
                <ItemTemplate>
                    <asp:Label ID="lblEquifaxResponse" runat="server" 
                        Text='<%# Bind("ResponseXML")%>' >
                    </asp:Label></div>                            
                </ItemTemplate>
            </asp:TemplateField>                          
        </Columns>

我的div，它显示一个带有CodeBehind分配的字符串的标签:

<div id="response">
    <asp:Label ID="lblDialog" runat="server" ></asp:Label>
</div>

jQuery对话框立即关闭

jQuery的live()方法在1.9版本中已被弃用和删除，并已被on()方法所取代。

因此，替换这个:

$("[id*=lnkEquifaxResponse]").live("click", function EquifaxResopnse() {
    $("#response").dialog("open");
});
与这个:

$("[id*=lnkEquifaxResponse]").on("click", function EquifaxResopnse() {
    $("#response").dialog("open");
    return false; // Prevents the postback
});

你可以用另一种方式:

$(document).ready(function() {
    $("[id*=lnkEquifaxResponse]").on("click", function EquifaxResopnse() {
            $("#lblDialog").empty();
        });
    if($("#lblDialog").text() != "")
    {
        $("#response").dialog("open");
    }
});

如果lnkEquifaxResponse引起回发，那么这就是问题所在。回发后，对话框将被重新呈现为关闭状态。你使用UpdatePanels或其他东西吗?

live方法已经被弃用了，它应该是这样的，你应该添加一个事件参数来传递给回调。你还需要添加preventDefault();它可以防止锚标记

的默认行为
  $("[id*=lnkEquifaxResponse]").on("click", function EquifaxResopnse(ev) {
        //prevents the default behavior of the anchor tag causing the page to postback or re-render
        ev.preventDefault();
        $("#response").dialog("open");
    });

你也可以在回调的末尾添加

return false;

，但这在IE和ev.preventDefault()检查IE和是否添加return false或returnValue相当错误。IE7喜欢看到这个，否则无法工作。

ev.returnValue = false;

在jQuery

中，preventDefault()的源代码如下所示
preventDefault: function() {
    this.isDefaultPrevented = returnTrue;
    var e = this.originalEvent;
    if ( !e ) {
        return;
    }
    // if preventDefault exists run it on the original event
    if ( e.preventDefault ) {
        e.preventDefault();
    // otherwise set the returnValue property of the original event to false (IE)
    } else {
        e.returnValue = false;
    }
},
相关文章：