Question

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head> 
<body>  
<div>
    <canvas id="myCanvas" width="510" height="510"></canvas>
    <script type="text/javascript">
        var c = document.getElementById("myCanvas");
        var ctx = c.getContext("2d");
        draw();

        function (ctx) {
            cxt.moveTo(10, 10);
            cxt.lineTo(500, 10);
            cxt.stroke();
        }
</div>
</body>
</html>

这不起作用，但是，如果我删除函数draw（）并将代码放在脚本中，它就会起作用，如下所示：

<script type="text/javascript">
    var c=document.getElementById("myCanvas");
    var cxt=c.getContext("2d");
    cxt.moveTo(10,10);
    cxt.lineTo(500,10);
    cxt.stroke();
</script>

我想知道如何使功能

Answer 1

两个代码段不相同。第一个示例定义（并立即丢弃）匿名函数。永远不会调用该函数，这就是为什么看起来你的代码“不起作用”。

修复缩进，这变得相当明显：

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
draw();

// Syntax error here
function(ctx){
    cxt.moveTo(10,10);
    cxt.lineTo(500,10);
    cxt.stroke();
}

正如评论者已经指出的那样，第一个例子也缺少</script>结束标记。我不知道你试图做什么与第二个例子有什么不同，第二个例子对你来说应该没问题，但我向你保证 - 这个问题没有与doctype有关。

Answer 2

也许你应该学习如何设置＆amp;首先调用函数。

这设置了一个功能：

function draw(ctx) {
    // etc
}

这会调用它，ctx作为参数：

draw(ctx);

不要忘记传递参数。代码中有两个名为ctx的变量，但它们的范围不同。不要只是假设你的函数应该知道它应该在函数内部ctx采用哪个值。

函数不适用于具有html doctype的文件

2 个答案: