0

这有效:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

  <script src="/js/msgv/widgets/excanvas2.js" type="text/javascript"></script>
  <script type="text/javascript" charset="utf-8">
    function canvasTest(){
      console.log("beginning canvasTest");
      var b_canvas = document.getElementById("regularCanvas");
      var b_context = b_canvas.getContext("2d");
      b_context.fillRect(50, 25, 150, 100);
    }
  </script>

</head>

<body onLoad="canvasTest()">
    <canvas id="regularCanvas" style="border: 1px dotted; float: left;" class="clear" height="225" width="300"></canvas>
</body>
</html>

这不会:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

两者之间的唯一区别是我在页面中加载它的位置。当我在头部加载 excanvas 时,一切正常。当我将它加载到身体底部时出现错误。

  <script type="text/javascript" charset="utf-8">
    function canvasTest(){
      console.log("beginning canvasTest");
      var b_canvas = document.getElementById("regularCanvas");
      var b_context = b_canvas.getContext("2d");
      b_context.fillRect(50, 25, 150, 100);
    }
  </script>

</head>

<body onLoad="canvasTest()">
    <canvas id="regularCanvas" style="border: 1px dotted; float: left;" class="clear" height="225" width="300"></canvas>
  <script src="/js/msgv/widgets/excanvas2.js" type="text/javascript"></script>
</body>
</html>
4

2 回答 2

3

实时调频

excanvas.js 文件必须在标记中出现任何画布元素之前包含在页面中。这是由于 IE 的限制,我们需要在 IE 看​​到标记中的任何实例之前施展魔法。建议放在头上。

于 2010-06-18T21:52:53.223 回答
0

如果您希望异步/有条件地加载 excanvas,则可以: https ://stackoverflow.com/a/18520897/541023

于 2013-08-29T21:05:56.610 回答