我是Dojo的新手,所以我需要一些帮助。

我的某些链接需要一段时间(当用户单击时,页面开始加载需要花费几秒钟的时间),我想添加一个“正在加载”消息。

我可以采用“旧的时尚方式”来做,但是我想学习新的,更简单,更智能的Dojo方式。

确切的工作方式现在并不重要,但我想像这样的事情:

一个矩形出现在浏览器窗口的中间。 (不是文档的中间。)它具有gif动画效果,并带有诸如“请稍候...”之类的消息。

所有其他元素都被禁用,也许有些“淡出”了。也许是一个大的50%白色透明矩形,它位于“正在加载”消息和文档的其余部分之间。

最佳答案

您所描述的假设是在模态dijit.Dialog与加载消息一起出现时,dojo本身已经被加载了。

现在,通常,页面完全加载后,dojo就开始执行,并且通常会将dojo代码放入作为dojo.addOnLoad()参数传递的匿名函数中。

这意味着您必须通过ajax(例如,使用dijit.layout.ContentPane)来加载页面的其余部分(称为“链接”)。这样,dojo可以在内容下载之前执行,并且“等待”消息可以更早出现。

它可能看起来像这样:

<html>

<head>
<link rel="stylesheet" href="/dojo/dijit/themes/tundra/tundra.css" type="text/css" media="screen" />
<script type="text/javascript" src="/dojo/dojo.js" djConfig="parseOnLoad:true"></script>
/* make sure that you shrinksafe together your libraries and dojo's for faster loading... */
<script type="text/javascript" src="/dojo/yourOwnDojoCompressedScripts.js"></script>
<script type="text/javascript">
   var dialog;
   dojo.addOnLoad(function(){
      dojo.require("dijit.layout.ContentPane");
      dojo.require("dijit.Dialog");
      dialog = new dijit.Dialog();
      dialog.setContent("<p>This page will be available in a tick!</p>");
      dialog.show();
   });
</script>
</head>

<body class="tundra">
   <div id="delayedContent"
        dojoType="dijit.layout.ContentPane"
        href="/myContentUrl"
        onLoad="dialog.hide()">
   </div>
</body>

</html>

该计划的唯一缺陷是dojo本身:希望您的收缩安全库的重量超过90K(可能多达300K,这取决于您放入的库的数量)。在连接速度较慢的情况下,下载仍然需要花费大量时间。就是说,我们说的是静态的90K-同一用户在每个 session 中只会下载一次,而如果您花时间在提供这些静态文件时花时间设置适当的缓存/过期 header ,则下载频率会更低。

07-24 09:38
查看更多