Canvas麻煩document.write

我在這段代碼中遇到了麻煩（我正在從本地PC上運行）。Canvas麻煩document.write

請您幫忙。

我的代碼如下：

<html> 
    <head> 
     <title>My Test</title> 
     <script src="../jquery/js/jquery-1.9.0.min.js"></script> 
    </head> 
    <body> 
     <script> 
      var _canvas = document.createElement('canvas'); 
      _canvas.width="100"; 
      _canvas.height="100"; 
      var _context = _canvas.getContext("2d"); 
      var _img = new Image(); 
      _img.src = "image/myImgTest.png"; 
      var _url; 

      _img.onload = function() { 
      DrawScreen(); // just some process: drawing image 
      _url = _canvas.toDataURL(); 
      alert("test"); **// this alert is printed on FF not on Chrome ???** 
      // window.location = url; **// With this command on FF, I show my Image** 
      document.write("<img src='"+url+"' >"); **// on FF, I show my image but when I would like to see the source code on my current page, there is nothing just blank ?? And on Chrome, I never show my image.** 

      **// In fact, I am expected to generate something like this: <img src="data:image/png;base64,iVBORw0KGgo....."> at this place ** 

      }; 
      function DrawScreen() { 
       // my process 
      } 

     </script> 

    </body> 
</html>

* //其實，我預計將產生這樣的：在這個地方*

來源

2013-02-27 user2056649

即使我會強烈建議不要使用'document.write'時下...你沒有表現出'DrawScreen（）'，你理應複製'_img'到'_canvas' – devnull69 2013-02-27 11:18:40

我的功能像這樣：function drawScreen（）{ \t _context.drawImage（_img，20,20,100,100,0,0,100,100）; }; – user2056649 2013-02-27 12:26:03

我的功能是這樣的：function drawScreen（）{_context.drawImage（_img，20,20,100,100,0,0,100,100）; };一些想法？ – user2056649 2013-02-28 05:26:07

當你在「本地計算機上工作「......你的本地PC上是否有網絡服務器，或者你是否直接從硬盤上打開HTML文件？

您可能希望將.src的分配移至.onload事件處理程序之後，因爲否則可能不會觸發.onload。

var _img = new Image(); 
var _url; 

_img.onload = function() { 
    ... 
}; 
_img.src = "image/myImgTest.png";

來源

2013-02-28 07:44:57 devnull69

嗨，我正在從我的測試沒有網絡服務器的硬盤上工作，所以只是一個HTML頁面。我會嘗試使用網絡服務器......這將是bizare，如果它會工作。此外，我試圖在onload事件後移動_img.src：它在FF上的結果是一樣的，我沒有任何關於chrome的東西。謝謝，如果你有一些想法。 – user2056649 2013-03-02 03:24:00

Canvas麻煩document.write

回答

相關問題