1

我有一个 MVC3 视图，它调用一个局部视图，该视图获取一个包含一些设置的模型，您可以在下面找到代码。

我不明白为什么每次调整窗口大小时，我的整个对话框都会调整大小并且初始内容消失。

我尝试了各种“居中”功能，但它们都产生相同的输出。我用的是IE9。

<div id="dialog">  
    <p>@Model.Message</p>  
</div>  

<script language="javascript" type="text/javascript">
    $(function () {
        $('#dialog').dialog({
            autoOpen: true,
            title: "@Model.Title",
            show: "blind",
            width: "@Model.Width",
            height: "@Model.Height",
            buttons: {"Ok": function () { $(this).dialog("close"); }
            },
            close: function(event, ui) {
                @if (!string.IsNullOrEmpty(Model.ReturnUrl))
                {
                    @:location.href = "@Url.Action("" + @Model.Action + "", "" + @Model.Controller + "", new { returnUrl = "" + @Model.ReturnUrl + "" })"
                }
                else { 
                    @:close: function(event, ui) { $(this).close(); }
                }
            },
            modal: true,
            resizable: false     
        });
    });  

 jQuery.fn.center = function () {
        this.css("position","absolute");
        this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
        this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
        return this;
    }

$(window).resize(function(){
    $("#dialog").center();
 });

我究竟做错了什么？

4

1 回答 1

0

您没有认识到您用作选择器的对话框元素不是对话框小部件的父级。该元素被包装，以便您的选择器元素成为内容区域。

外包装具有 class="ui-dialog"。在您的插件功能目标$(this).closest('.ui-dialog')中进行位置调整。它已position:absolute在创建期间设置为。

于 2012-06-19T00:27:36.837 回答