Download-Attribut in Einem tag funktioniert nicht im IE

Aus dem folgenden code, den ich erschaffe eine dynamische Anker-tag, die eine Datei herunterlädt. Dieser code funktioniert auch in Chrome, aber nicht im IE. Wie bekomme ich diese zu arbeiten

<div id="divContainer">
    <h3>Sample title</h3>
</div>
<button onclick="clicker()">Click me</button>

<script type="text/javascript">

    function clicker() {
        var anchorTag = document.createElement('a');
        anchorTag.href = "http://cdn1.dailymirror.lk/media/images/finance.jpg";
        anchorTag.download = "download";
        anchorTag.click();


        var element = document.getElementById('divContainer');
        element.appendChild(anchorTag);
    }

</script>

Warum tun Sie sich die Mühe machen appendChild wenn Sie klicken Sie zuerst? Ad warum klicken Sie es, wenn Sie tun können, location=URL
Ich sehe keinen Sinn darin, eine neue ein-tag. Warum nicht, lösen Sie den download, wenn du auf den Klick mich button. Web-Benutzer nicht wie auf
Für Referenz caniuse.com/#feat=download

InformationsquelleAutor Nipuna | 2013-08-23

24

Internet Explorer derzeit nicht unterstützt die Download Attribut auf A - tags.

Sehen http://caniuse.com/download und http://status.modern.ie/adownloadattribute; der letztere zeigt an, dass das feature "Unter Berücksichtigung" für IE12.

Also es gibt keine Problemumgehung, um den Datei-Namen im IE?
Ist Ihre Frage nicht ausreichend präzise. Die Datei-Bereitstellung-server wählt den Dateinamen.
Ich habe ein workaround für dieses im IE, anstatt der Schaffung einer <a> tag. verwenden Sie einfach diese eine Zeile...navigator.msSaveBlob(blob, fileName); Kredit download.js für die folgende Zeile: github.com/rndme/download/blob/master/download.js#L143
2017 Noch kein IE12... Dieses feature unterstützt Edge, obwohl.
IE12 = Rand... zumindest die erste version von Edge

InformationsquelleAutor EricLaw
18

In meinem Fall, da es eine Voraussetzung für die Unterstützung der Verwendung von IE 11 (version 11.0.9600.18665), landete ich mit der Lösung von @Henners auf seinen Kommentar:
```
//IE10+ : (has Blob, but not a[download] or URL)
if (navigator.msSaveBlob) {
    return navigator.msSaveBlob(blob, fileName);
}
```
Ist es ganz einfach und praktisch.

Offensichtlich, dass diese Lösung gefunden wurde, auf der Javascript - download Funktion erstellt dandavis.

Ich habe versucht, dies und der blob ist nicht definiert. Können Sie erklären, wie zu definieren, blob und was Sie in Sie setzen. Ich habe einfach die URL der Datei. Gibt es eine Möglichkeit zum laden einer Datei in ein blob von der URL?
Vielleicht diese Antwort kann Ihnen helfen, zu erreichen, die Umwandlung, die Sie wollen. Danach, Sie müssen nur zum auslösen der download wie bereits erwähnt in meiner Antwort.

InformationsquelleAutor aribeiro
9

Alte Frage, aber dachte, ich würde hinzufügen, unsere Lösung. Hier ist der code, den ich für mein letztes Projekt. Es ist nicht perfekt, aber es ging QA in alle Browser und IE9+.
```
downloadCSV(data,fileName){
  var blob = new Blob([data], {type:  "text/plain;charset=utf-8;"});
  var anchor = angular.element('<a/>');

  if (window.navigator.msSaveBlob) { //IE
    window.navigator.msSaveOrOpenBlob(blob, fileName)
  } else if (navigator.userAgent.search("Firefox") !== -1) { //Firefox
    anchor.css({display: 'none'});
    angular.element(document.body).append(anchor);

    anchor.attr({
      href: 'data:attachment/csv;charset=utf-8,' + encodeURIComponent(data),
      target: '_blank',
      download: fileName
    })[0].click();

    anchor.remove();
  } else { //Chrome
    anchor.attr({
      href: URL.createObjectURL(blob),
      target: '_blank',
      download: fileName
    })[0].click();
  }
}
```
Mit dem ms-spezifischen API gearbeitet, für uns am besten im IE. Beachten Sie auch, dass einige Browser erfordern die Anker, um tatsächlich in den DOM-für das download-Attribut zu arbeiten, in der Erwägung, dass Chrome zum Beispiel nicht. Auch fanden wir einige Unstimmigkeiten, wie mit Blobs arbeiten in verschiedenen Browsern. Einige Browser haben auch ein export-limit. Dies ermöglicht die größtmögliche CSV-export-in jedem browser, soweit ich weiß.

target="blank" funktioniert gut für mich auf IE11, warum war das nicht die ganze Antwort?
kannst du bitte erklären Sie mir, was sollte das Daten-format ?
OP erwähnt nichts über Eckige, auf die sich diese Antwort angewiesen.

InformationsquelleAutor Kevin
5

Als der build 10547+, Microsoft Edge-browser unterstützt nun die download Attribut auf a - tags.

<a href="download/image.png" download="file_name.png">Download Image</a>

Edge-features-update: https://dev.windows.com/en-us/microsoft-edge/platform/changelog/desktop/10547/

[download] standard: http://www.w3.org/html/wg/drafts/html/master/links.html#attr-hyperlink-download

InformationsquelleAutor MWOJO

Diesem code-fragment ermöglicht das speichern von blob-in die Datei im Internet Explorer, Edge und anderen modernen Browsern.

var request = new XMLHttpRequest();
request.onreadystatechange = function() {

    if (request.readyState === 4 && request.status === 200) {

        //Extract filename form response using regex
        var filename = "";
        var disposition = request.getResponseHeader('Content-Disposition');
        if (disposition && disposition.indexOf('attachment') !== -1) {
            var filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
            var matches = filenameRegex.exec(disposition);
            if (matches != null && matches[1]) filename = matches[1].replace(/['"]/g, '');
        }

        if (window.navigator.msSaveOrOpenBlob) { //for IE and Edge
            window.navigator.msSaveBlob(request.response, filename);
        } else {
            //for modern browsers
            var a = document.createElement('a');
            a.href = window.URL.createObjectURL(request.response);
            a.download = filename;
            a.style.display = 'none';
            document.body.appendChild(a);
            a.click();
        }
    }

    button.disabled = false;
    dragArea.removeAttribute('spinner-visible');
    //spinner.style.display = "none";

};
request.open("POST", "download");
request.responseType = 'blob';
request.send(formData);

Für IE und Edge verwenden: msSaveBlob

InformationsquelleAutor Alexey

Nutzung meiner Funktion

Es binden Ihre atag herunterladen der Datei in Internet Explorer

function MS_bindDownload(el) {
    if(el === undefined){
        throw Error('I need element parameter.');
    }
    if(el.href === ''){
        throw Error('The element has no href value.');
    }
    var filename = el.getAttribute('download');
    if (filename === null || filename === ''){
        var tmp = el.href.split('/');
        filename = tmp[tmp.length-1];
    }
    el.addEventListener('click', function (evt) {
        evt.preventDefault();
        var xhr = new XMLHttpRequest();
        xhr.onloadstart = function () {
            xhr.responseType = 'blob';
        };
        xhr.onload = function () {
            navigator.msSaveOrOpenBlob(xhr.response, filename);
        };
        xhr.open("GET", el.href, true);
        xhr.send();
    })
}

InformationsquelleAutor EunSeong Lee

0

Append Kind zuerst und klicken Sie dann auf

Oder können Sie Fenster.location= 'url' ;

Wenn ich append Kind zuerst und klicken Sie dann auf. Es leitet Sie an das Bild als Download
Fenster.location= 'url' ; funktioniert nicht im IE funktioniert

InformationsquelleAutor Shadow
0

Wie bereits in früheren Antwort , download-Attribut wird nicht unterstützt in IE . Als Problemumgehung können Sie iFrames verwenden, um die Datei herunterzuladen . Hier ist ein Beispiel-code-snippet.
```
function downloadFile(url){
    var oIframe = window.document.createElement('iframe');
    var $body = jQuery(document.body);
    var $oIframe = jQuery(oIframe).attr({
        src: url,
        style: 'display:none'
    });
    $body.append($oIframe);

}
```
Wie soll dies funktionieren? Ich habe ein iframe angehängt, die rechts vor dem schließenden </body> - tag mit einer Quelle meiner Datei.
Wenn die content-disposoition in der header-Anhang , wird er versuchen zu laden statt den Inhalt im iFrame.
header('Content-Disposition: attachment; filename="Dateiname"');

InformationsquelleAutor May13ank

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.