Onload（）處理程序在IE中沒有響應

我正在創建畫布並使用drawImage（）繪製內聯svg。一切工作正常，但我卡住，因爲下面的問題...Onload（）處理程序在IE中沒有響應

我的問題是，處理程序處理程序沒有在IE中響應？ Rhis在FF和chhrome工作。我如何解決它在IE 9中向上工作？

img2.onload = function() { 
    console.log("load"); 
}

jsFiddle

function createme() { 
     var test = $('<canvas />', { id : 'mycanvs' }) 
     $('#album').append(test); 

     var svg2 = document.getElementById('sSource').innerHTML, 
      vms = test[0], //canvas 
      ctx2 = vms.getContext('2d'); 

     svgToImage(svg2); 

     function svgToImage(svg2) { 
     var nurl = "data:image/svg+xml;utf8," + encodeURIComponent(svg2), 
      img2 = new Image; 
      alert("just before onload") 
      img2.onload = function() { 
       console.log("load"); // does not show 
      } 
      img2.src = nurl; 
     } 
}

來源

2015-04-03 Becky

爲了澄清，修復'charset = utf-8'讓你從SVG創建圖像的一部分。但是......儘管你可以**將SVG繪製到畫布上，但在IE中，由於IE的安全限制，您無法**將畫布內容導出到具有'canvas.toDataURL'的圖像。 Chrome和FF沒有這種安全限制，您可以從這些瀏覽器獲取SVG內容的dataURL（並因此創建圖像）。 – markE 2015-04-04 06:27:44

@markE：感謝您的輸入。如果我需要能夠將畫布內容導出到IE中的圖像，那麼解決方案是什麼？ – Becky 2015-04-04 07:43:46

我不認爲IE有直接的解決方案，因爲當svg被繪製時，畫布會立即受到污染。接下來的最佳解決方案是將svg發送回服務器並將其轉換爲.png（這不會污染畫布）。 – markE 2015-04-04 15:49:47

我沒有一個IE虛擬機上運行的時刻，但根據their docs處理程序具有對象本身之前定義：

要確保事件處理程序接收這些對象的onload事件，將定義事件處理程序的腳本對象放置在之前對象並使用對象中的onload屬性來設置處理程序。

我不明白爲什麼你的代碼將不能在IE瀏覽，但稍微讓你的處理程序之前你這個定義撥弄調整創建圖像對象......這給一試：

function createme() { 
     var test = $('<canvas />', { id : 'mycanvs' }); 
     var onloadHandler = function() { 
      console.log("load"); 
     }; 
     $('#album').append(test); 

     var svg2 = document.getElementById('sSource').innerHTML, 
      vms = test[0], //canvas 
      ctx2 = vms.getContext('2d'); 

     function svgToImage(svg2) { 
     var nurl = "data:image/svg+xml;utf8," + encodeURIComponent(svg2), 
      img2 = new Image; 

      img2.onload = onloadHandler 

      img2.src = nurl; 
     } 
     svgToImage(svg2); 
} 
createme();

https://jsfiddle.net/z769z7af/10/

來源

2015-04-03 20:21:45 pherris

謝謝。 :)但仍然無法在IE中使用。如果你在IE中運行它，你會看到你的自我。 – Becky 2015-04-03 20:31:28

hm ...我沒有虛擬機在這臺機器上，但我可以稍後看...現在我正在查看代碼，我不知道是否缺少'（）''後'新圖像可能造成問題？ – pherris 2015-04-03 20:36:33

錯誤是由於缺少關鍵字charset=utf-8。

var nurl = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(svg2),

來源

2015-04-03 21:23:26 Becky

Onload（）處理程序在IE中沒有響應

回答

相關問題