2014-03-26 27 views
3

以下代碼適用於谷歌瀏覽器,但不適用於IE11。下載img throught超鏈接<a>使用javascript的IE11

<!DOCTYPE html> 
<html> 
<head> 
    <title>title</title> 
</head> 
<body> 
    <img id="img1" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAASUlEQVRo3u3PAQ0AIAwDsIGC+TcL 
LkhOWgddSU6Ga5udT4iIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIi8cQEjUgGT 
mE6z3QAAAABJRU5ErkJggg==" /> 
    <script> 
     var a = document.createElement('a'); 
     var image = document.getElementById('img1'); 
     a.setAttribute('href', image.src); 
     a.setAttribute("download", 'fileName'); 
     document.body.appendChild(a); 
     a.click(); 
     document.body.removeChild(a); 
    </script> 
</body> 
</html> 

當我在IE11上運行這個代碼,我已經得到了消息:「是否要允許此網站在您的計算機上打開一個應用程序」

點擊「允許」我有後「沒有應用程序安裝到打開這種類型的鏈路(數據)」

如何使它在IE11工作?

+0

它只是意味着你做沒有可以處理IE中安裝的數據:協議的應用程序。我得到HTML1300:導航發生。 File:unknownprotocol.htm – mplungjan

+0

@mplungjan,那麼如何讓它工作? – 31415926

+0

在您的IE上安裝數據協議處理程序? - 在這裏閱讀評論http://msdn.microsoft.com/en-us/library/cc848897(v=vs.85).aspx – mplungjan

回答

5

這一個是有用的IE10 +:http://msdn.microsoft.com/en-us/library/hh779016(v=vs.85).aspx

類似:

<!DOCTYPE html> 
<html> 
<head> 
    <title>title</title> 
</head> 
<body> 
    <img id="img1" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAASUlEQVRo3u3PAQ0AIAwDsIGC+TcL 
LkhOWgddSU6Ga5udT4iIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIi8cQEjUgGT 
mE6z3QAAAABJRU5ErkJggg==" /> 
    <canvas id="canvas1"></canvas> 
    <script> 
     var image = document.getElementById('img1'); 
     var canvas = document.getElementById('canvas1'); 
     var ctx = canvas.getContext('2d'); 
     ctx.drawImage(image, 0, 0, image.width, image.height); 
     window.navigator.msSaveBlob(canvas.msToBlob(), 'drawingFileName.png'); 
    </script> 
</body> 
</html> 
2

你不能使用IE瀏覽器這種方式,因爲即使是11版不suppport「下載」錨元素的屬性:http://caniuse.com/download

你將不得不求助於服務器端生成圖像和它發送到客戶端

+0

我正在開發一個適用於win8商店的應用程序,所以我沒有服務器。該代碼應該能夠將飛行生成的圖像保存到用戶的硬盤上。任何想法如何做到這一點? – 31415926

+0

不是我的頭頂不是HTML/JS。它可以是本機Win8應用程序嗎? –

+0

看看是否有幫助:http://hackworthy.blogspot.com/2012/05/savedownload-data-generated-in.html我還沒有讀入細節,但看起來像跨瀏覽器支持 –