2016-04-27 124 views
1

我試過可用拖放下載樣本,但問題是它在Chrome中完美的罰款,但是當你試圖拖放文件到本地機器的意圖使用IE下載,它只下載到文件的快捷鏈接。拖拖放下載支持IE瀏覽器的Javascript/jQuery/Html5

任何人都有解決問題的辦法?請分享...

我試着在下面的鏈接中使用代碼。 http://www.thecssninja.com/javascript/gmail-dragout

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
 

 
<html lang="en-GB"> 
 

 
<head> 
 
\t <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 
 
\t <meta name="author" content="The CSS Ninja"> 
 
\t <meta name="keywords" content="Drag and drop, HTML5, DownloadURL, setData, dataTransfer"> 
 
\t <meta name="description" content="How to create reverse drag and drop functionality like Gmail in Chrome 5 and upwards"> 
 
\t <meta name="robots" content="all"> 
 
\t <meta name="copyright" content="The CSS Ninja"> 
 
\t 
 
\t <link rel="stylesheet" type="text/css" href="_styles.css" media="screen"> 
 
\t 
 
\t <title>Drag a file from a website to your filesystem like Gmail does | The CSS Ninja</title> 
 

 
</head> 
 
<body> 
 
\t 
 
\t <div class="container"> 
 
\t \t <h1>Drag out any of these links to your dekstop</h1> 
 
\t \t 
 
\t \t <a href="Eadui.ttf" id="dragout" class="dragme" draggable="true" data-downloadurl="application/octet-stream:Eadui2.ttf:http://thecssninja.come/demo/gmail_dragout/Eadui.ttf">Font file</a> 
 
\t \t 
 
\t \t <a href="Eadui.ttf" id="dragout2" class="dragme" draggable="true" data-downloadurl="application/pdf:HTML5CheatSheet.pdf:http://thecssninja.come/demo/gmail_dragout/html5-cheat-sheet.pdf">PDF file</a> 
 
\t </div> 
 
\t 
 
\t <script type="text/javascript"> 
 
\t \t var files = [document.getElementById("dragout"),document.getElementById("dragout2"),document.getElementById("dragout3")], 
 
\t \t \t fileDetails = []; 
 
\t \t 
 
\t \t // Some forward thinking, utilise the custom data attribute to extend attributes available. 
 
\t \t if(typeof files[0].dataset === "undefined") { 
 
\t \t \t // Grab it the old way 
 
\t \t \t fileDetails[0] = files[0].getAttribute("data-downloadurl"); 
 
\t \t \t fileDetails[1] = files[1].getAttribute("data-downloadurl"); 
 
\t \t } else { 
 
\t \t \t fileDetails[0] = files[0].dataset.downloadurl; 
 
\t \t \t fileDetails[1] = files[1].dataset.downloadurl; 
 
\t \t } 
 
\t \t 
 
\t \t files[0].addEventListener("dragstart",function(evt){ 
 
\t \t \t evt.dataTransfer.setData("DownloadURL",fileDetails[0]); 
 
\t \t },false); 
 
\t \t files[1].addEventListener("dragstart",function(evt){ 
 
\t \t \t evt.dataTransfer.setData("DownloadURL",fileDetails[1]); 
 
\t \t },false); 
 
\t </script> 
 
\t 
 
</body> 
 
</html>

+1

你可以包括'html','javascript'試過了嗎? – guest271314

+0

請參考我用代碼示例修改它的原始問題。 – Dspinx

回答

-1

你的代碼工作正常在Chrome中,FF,歌劇,Safari和微軟的邊緣。

爲什麼要在舊版瀏覽器上工作Microsoft no longer supports

我的建議是因爲它不再被支持告訴你的用戶使用supported browser

+0

該解決方案的主要目的是將功能添加到在IE上運行的SharePoint網站中...因此,Chrome和FF不適合。 – Dspinx

+0

您從未這麼說過。您說過,「我嘗試使用[this](http://www.thecssninja.com/javascript/gmail-dragout)資源中的代碼」。我對SharePoint並不熟悉,但我確實知道它是Microsoft產品並支持Edge。 [微軟不再支持IE](https://www.microsoft.com/en-us/WindowsForBusiness/End-of-IE-support),因此代碼無效。節省頭痛。 –

+0

我的壞...謝謝反正.... – Dspinx