2

我是 javascript 新手，在允许游戏继续之前，我有一个关于加载和确认加载所有资产、脚本等的问题。基本上，如何知道所有资产和脚本何时加载......

这似乎是一个微不足道的问题/问题，但我已经问过几个程序员，似乎没有人有明确的答案。

我有一个 html 页面来加载资产 - 即 png 等，所有指定的 vis css - 没有指定内联。

我也有很多自定义的 javascript 类等，包括 jquery、loading。

我目前正在使用它来确认页面加载 - 当页面加载功能运行时，内容变得可见。页面上有一个小的加载微调器被删除。

我正在使用 jQuery 标准加载脚本——$(document).ready(function()

</head>
<body  onload="doAfterPageLoad()">

<div id="wrapper"  >

<div id="loadingIcon" >
    <div id="loadingWord"></div>
</div>
<div id="content"  style="visibility: hidden;">
    <!-- html stuff here -->
       </div>
</div>

</body>
</html>


//Javascript jQuery stuff....
<script type="text/javascript">
    function doAfterPageLoad()
    {
        $("#loadingIcon").css("visibility","hidden");
        $("#content").css("visibility","visible");
    }

    $(document).ready(function()
    {       
        // start javascript stuff
    });
 </script>

我的问题 - 这是同步的吗？（我处于快速连接状态，无法判断）是否有可能出现故障？-我是否应该设置一个变量并在两个“加载”完成时计数并使用它来开始游戏？而且，如果我选择通过 javascript 加载器加载一些 png 资产文件，是否应该提供触发加载完成所需的第三个变量/值？

4

3 回答 3

2

jQuery 提供了load()函数，所以不要$(document).ready做

$(window).load(function()
{       
    // start javascript stuff
});

它会在加载所有资产时触发

于 2012-09-26T17:26:41.147 回答
0

你有正确的想法。将所有 DOM 就绪的依赖项放入以下内容：

$(document).ready(function()
{       
    // start javascript stuff
});

就像你说的，这是允许 html 在允许 javascript 执行之前先在页面上呈现。

于 2012-09-26T17:24:33.000 回答
0

我发现的最佳解决方案是使用 requirejs。

http://requirejs.org

简而言之，它解决了这个问题，允许您根据需要加载脚本，并且知道它们已加载。它使应用程序更快，因为您只在需要时加载脚本。

基本语法是：

require(
    ["jquery","module"], // these are your dependancies
    function($,module){ // this is what you want to do after your deps have been loaded
        // do stuff
    });

在 requirejs 中，每个依赖模块都定义在自己的文件中。您的模块被包装在一个 define() 函数中，以允许 requirejs 提取它：

define(
        ["jquery"], // these are your dependancies
        function($){ // this is what you want to do after your deps have been loaded
            var module= {
                // my widget definition
            };
            return module;
        });
于 2012-09-28T16:41:38.700 回答