Windows 8 windows8devcenter上的windows8html5/JavaScript画布教程；行不通_Windows 8

Windows 8 windows8devcenter上的windows8html5/JavaScript画布教程；行不通

windows-8

Windows 8 windows8devcenter上的windows8html5/JavaScript画布教程；行不通,windows-8,Windows 8,我试图在Windows 8开发中心上完成本教程：但还没有跨过第一步。在我的HTML5文件中，我有： <canvas id="can1" width="500" height="500"></canvas> var myCanvas = document.getElementById("can1"); var myContext = myCanvas.getContext("2d"); 我正在使用Visual Studio Express 2012 for Windo

我试图在Windows 8开发中心上完成本教程：

但还没有跨过第一步。在我的HTML5文件中，我有：

<canvas id="can1" width="500" height="500"></canvas>

var myCanvas = document.getElementById("can1");
var myContext = myCanvas.getContext("2d");

我正在使用Visual Studio Express 2012 for Windows 8。我得到以下错误：“0x800a138f-JavaScript运行时错误：无法获取未定义或空引用的属性“getContext”

这正是教程所说的。为什么我会得到一个错误？

如果你使用空白模板（如你的注释中所提到的），那么将建议的演示代码放在OnAc激活事件中应该是有效的。下面应该显示从黑框左上角到右下角的白线

在default.html中：

<body>
    <p>Content goes here</p>
    <canvas id="can1" width="500" height="500"></canvas>
</body>

您在JavaScript文件中的何处添加了代码？HTML文件是否包含标签中的JavaScript文件？我使用VisualStudio Express 2012为Windows 8创建空白模板，该模板创建单独的HTML、JavaScript和CSS文件。HTML和JavaScript是完全分开的。onactivated做到了这一点。谢谢

app.onactivated = function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {
        if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
            // TODO: This application has been newly launched. Initialize
            // your application here.
        } else {
            // TODO: This application has been reactivated from suspension.
            // Restore application state here.
        }

        var myCanvas = document.getElementById("can1");
        var myContext = myCanvas.getContext("2d");

        myContext.fillStyle = '#000';
        myContext.strokeStyle = '#fff';
        myContext.fillRect(0, 0, 500, 500);
        myContext.lineWidth = 3;
        myContext.fill();

        myContext.moveTo(0, 0);
        myContext.lineTo(500, 500);
        myContext.stroke();

        args.setPromise(WinJS.UI.processAll());
    }
};