Question

当我启动我的应用程序时，dojo开始加载但尚未完全解析，因此屏幕看起来很难看！

有没有办法隐藏这个丑陋的屏幕，直到它被解析完全加载？

由于多米尼克

编辑添加SNIPPET 我听说WL Studio会自动隐藏身体，因此无需创建叠加层。

这是我的HTML

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<meta name="viewport"
    content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="stylesheet" href="css/Test.css">
<script>
    window.$ = window.jQuery = WLJQ;
</script>
<script type="text/javascript"
    data-dojo-config="isDebug: false, async: true, parseOnLoad: true, mblHideAddressBar: false"
    src="dojo/dojo.js"></script>
</head>
<body id="content" style="display: none;">
    <div id="main" data-dojo-type="dojox.mobile.View"
        data-dojo-props='selected:true'>
        <div data-dojo-type="dojox.mobile.Heading"
            data-dojo-props='fixed:"top"'>Main Screen</div>
        <button id="refreshBte" data-dojo-type="dojox.mobile.Button"
            style="width: 100%">Refresh</button>
        <button id="settingsBte" data-dojo-type="dojox.mobile.Button"
            style="width: 100%">Setting</button>
    </div>
    <!--application UI goes here-->
    <script src="js/initOptions.js"></script>
    <script src="js/Test.js"></script>
    <script src="js/messages.js"></script>
</body>
</html>

和我的js

function wlCommonInit(){
    require([ "dojo/core-web-layer", "dojo/mobile-ui-layer",
            "dojo/mobile-compat-layer" ], dojoInit);

}

function dojoInit() {
    require([ "dojo", "dojo/parser", "dojox/mobile", "dojox/mobile/compat",
            "dojox/mobile/deviceTheme", "dojox/mobile/Heading", "dojox/mobile/Button" ],
            function(dojo) {
                dojo.ready(function() {
                });
            });
}

我还尝试在其中添加hidden =“hidden”，但它不会改变任何内容。

有什么想法吗？

Answer 1

是的，

您需要构建加载叠加层。看看这个教程：

http://dojotoolkit.org/documentation/tutorials/1.6/recipes/loading_overlay/

Answer 2

我通常对此做的是：

<div id="main" style="visibility: hidden;"></div>

解析完成后：将主要可见性设置为再次可见。

可能无法完全解决问题（取决于浏览器能够以多快的速度解析布局），但是在将它转换为小部件之前，您将无法显示简单的html。

进一步参考： dojo / Ready =检测何时解析页面。

隐藏丑陋的启动屏幕（dojox尚未完全解析）

2 个答案: