Question

我一直在尝试使用UI对话框窗口来显示现有表单（具有表单且没有布局的页面）。我不确定我是否以正确的方式做这件事，但似乎工作正常减去几件不良行为。这就是现在的行为：

没有conent的对话框窗口打开（非常小/空）
大约半秒后，内容加载，窗口不断膨胀（视觉上看起来很糟糕）
即使加载内容时窗口宽度会扩展，标题栏也不会调整为新宽度，并且宽度仍然非常小。虽然如果resizeable设置为'true'，标题将会扩展。当加载隐藏div的内容时，它只是没有响应宽度调整。

在内容加载到对话框之前，我怎么能不显示对话框？如何在内容加载完成后强制对话标题进行宽度调整？

<A HREF="javascript:newItem('foo')">CREATE NEW FOO ITEM<A>

<script type="text/javascript">
    newItem= function(type) {
      $("#form_load").load(
          '/items/new', {item_type: type}).dialog({
                modal:true,
                draggable: true,
                resizable: false,
                width:'auto',
                height:'auto',
                title: 'Some title',
                position: [150, 150]
          });
    };
</script>

谢谢！

Answer 1

您要在加载内容后调用对话框。您可以使用$ .load的回调方法来完成此操作。

<script type="text/javascript">
    newItem = function(type) {
        $("#form_load").hide().load(
            '/items/new',
            {item_type: type},
            function (data) {
                $(this).dialog({
                    modal     : true,
                    draggable : true,
                    resizable : false,
                    width     : 'auto',
                    height    : 'auto',
                    title     : 'Some title',
                    position  : [100, 100]
                });
            }
        });            
    }
</script>

您可能还想要包含隐藏/显示切换，以便在加载内容之前不显示#form_load容器。

请在此处查看jQuery的$ .load文档：http://api.jquery.com/load/

更新：添加了.hide（），因此在创建对话框之前不会显示内容。

UI对话框窗口 - 如何在加载内容之前不显示对话框？

1 个答案: