0

我在我的 default.ctp 布局中使用了几个元素，即：

echo $this->element('messagesDialog');
echo $this->element('manualpDialog');

它们属于我的布局，随时可用。在我的 .js 上，我将这些元素隐藏在准备好的文档中：

$('#dialog-messages').hide();

问题是这些元素（只是一个带有表格的 div 等）在页面加载时部分可见，这看起来很丑陋且有问题。请注意，由于我的元素在布局中，它们会短暂地显示在用户看到的任何主页上。

为了防止这些 div 半显示，我想在需要时以某种方式“创建”它们，然后将它们处理掉。（我使用jQuery）。

下面的解决方案（来自How can I make the browser waiting to display the page until it's fully loaded?）对我来说很难使用，因为我的 default.ctp 非常拥挤，元素和脚本代码以及蛋糕的东西都放在一个单格

<body>
<div id="msg" style="font-size:largest;">
<!-- you can set whatever style you want on this -->
Loading, please wait...
</div>
<div id="body" style="display:none;">
<!-- everything else -->
</div>
<script type="text/javascript">
$(document).ready(function() {
    $('#body').show();
    $('#msg').hide();
});
</script>
</body>

我认为解决方案是让我的元素，例如

echo $this->element('messagesDialog');

仅在适当的时候（当用户想要查看他的消息时）加载到我的布局中，并且 - 如果可能的话 - 被删除以防止在页面被实例化后半显示为页面加载。

关于如何做到这一点的任何想法？

非常感谢！

4

1 回答 1

1

如果不需要元素，则不应加载它们。相反，在您的布局文件中创建一个 IF 条件，该条件根据控制器名称和操作名称加载元素。如果您使用会话跟踪用户，您还可以基于会话变量的 IF。

或者，您可以简单地将元素放入 div 中，例如：

<div class="hiddenClass" style="display: none;">
<?php echo $this->element('messagesDialog'); ?>
</div>

然后在您的 javascript 部分中使用以下内容： $('.hiddenClass').show();

于 2013-02-13T01:55:54.053 回答