CreateJS中的PreloadJS无法正常工作

4

我正在尝试使用PreloadJS学习图片预加载技术。

以下是我的代码:

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <script src="easeljs-0.6.0.min.js"></script>
    <script src="preloadjs-0.3.0.min.js"></script>
    <script src="soundjs-0.4.0.min.js"></script>    
    <script>
        var stage, output, queue;
        function handleComplete() {
            var backgroundImage=new createjs.Bitmap("myImg");
            stage.addChild(backgroundImage);
            stage.update();
        }
        function init() {
            stage = new createjs.Stage("demoCanvas");
            queue = new createjs.LoadQueue();
            queue.installPlugin(createjs.Sound);
            queue.addEventListener("complete", handleComplete);
            queue.loadFile({id:"myImg", src:"Background.png"});
        }
    </script>
</head>
<body onLoad="init();">
    <canvas id="demoCanvas" width="1300" height="600">
        Your browser does not support canvas
    </canvas>
</body>
</html>

当我加载页面时,出现了这个错误:
Access is denied: preloadjs-0.3.0.min.js, line 50 character 333

我跟踪了调用堆栈,发现错误是由以下行生成的:
queue.loadFile({id:"myImg", src:"Background.png"});

你能告诉我哪里出了错吗?


你的意思是预加载图片,以便在图片准备好显示之前页面根本不会显示吗? - orb
尝试使用绝对路径作为 src,例如:http://localhost/background.png - Ikrom
1
我正在开发一个HTML5/JavaScript游戏。我有很多图片需要加载。我正在尝试使用PreloadJS来加载这些图片。 :-) - Sachin Joseph
1个回答

4
路径类型(绝对/相对)不应该影响,但是加载的位置可能会有所不同。
默认情况下,PreloadJS将尝试使用XHR(XMLHttpRequests)加载内容,这仅在服务器上加载时有效(file://无法工作,您应该改用localhost),并且来自同一域。您可以尝试将false作为参数传递给LoadQueue,以便它使用标签加载图像,从而解决大多数错误。

queue = new createjs.LoadQueue(false);

通常从XHR加载时遇到的错误是跨域错误,而不是"拒绝访问"。如果您从文件系统加载,请确保文件不是只读的或具有某种保护措施。

这是一个指向createjs网站上该类的直接链接 - http://createjs.com/docs/preloadjs/classes/LoadQueue.html - Meetai.com

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接