jquery - 回发后 CSS 样式未重新应用于 jQuery 对话框

Question

我有一个常用的 jQuery 对话框 div，其中包含一个包含在更新面板中的数据输入用户控件。在第一次回发之前它看起来很棒。之后根本没有应用任何样式。 (控件保留它们的值，事件继续按预期运行。)关闭对话框后，如果有回发，则后续的 .dialog("open") 调用没有应用任何样式。

    $(function () {
        var dlg = jQuery("#EventMod").dialog({
            autoOpen: false
            , modal: true
        });
        dlg.parent().appendTo(jQuery("form:first"));  

        $(".NewEvent").click(function () {
            $("#EventMod").dialog("open");
            return false;
        });
    });

对话框div在这里:

<div id="EventMod" title="Event Modify" class="ui-helper-hidden">
    <asp:UpdatePanel ID="updNewEvent" runat="server">
        <ContentTemplate>
            <uc1:EventEdit ID="NewEvent" runat="server" />
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

在用户控件中，类不是动态分配的，它们看起来像这样:

    <table class="NewEvent" >
        <tr>
            <td align="center">
                <table class="Event">
                    <tr class="Title">
                        <th width="55">
                            <strong>Event #</strong>
                        </th>
    ... snip ...

我在父页面中链接了样式表。我也尝试将它添加到用户控件中，但没有看到任何结果。

Answer 1

我以前有过这样的怪事，必须这样做才能在 UpdatePanel 中获得稳定的结果:

   $(function () {

        var titleText="This is the title"
        var key = "uniqueId";
        var newParentDiv= "#" + key;
        var div = $("<div title='" + titleText + "' id='" + key+ "'></div>");
        $('body').append(div);
        $(newParentDiv).html($("#EventMod").html());

        var dlg = jQuery(newParentDiv).dialog({
            autoOpen: false
            , modal: true
        });
        dlg.parent().appendTo(jQuery("form:first"));  

        $(".NewEvent").click(function () {
            $(newParentDiv).dialog("open");
            return false;
        });
   });

我的问题是 jQuery 对话框实际上将您的内容移动到 DOM 中的新位置。如果发生部分回发，它不会更新 jQuery UI 放置对话框的 DOM，它就会变得陈旧或挂起。