Maison > interface Web > js tutoriel > le corps du texte

exemple de code js pour implémenter la fonction de téléchargement

不言
Libérer: 2018-08-11 14:16:24
original
1871 Les gens l'ont consulté

Le contenu de cet article concerne des exemples de code pour implémenter la fonction de téléchargement dans js. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文件下载</title>
    </head>
    <body>
    <div onclick="funDownload(&#39;1111111111&#39;,&#39;文档.txt&#39;)">点我啊</div>
    <div onclick="download(&#39;你棒&#39;,&#39;https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1533799465&di=0f7445fba7d177bfd21b2d71d41531fb&src=http://pic28.photophoto.cn/20130717/0010023915569244_b.jpg&#39;)">点我啊</div><div onclick="downloadUrl(&#39;https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1533799465&di=0f7445fba7d177bfd21b2d71d41531fb&src=http://pic28.photophoto.cn/20130717/0010023915569244_b.jpg&#39;)">点我啊</div>
    <script>
    function funDownload(content, filename) {
        // 创建隐藏的可下载链接
        var eleLink = document.createElement(&#39;a&#39;);
        eleLink.download = filename;
        eleLink.style.display = &#39;none&#39;;        
        // 字符内容转变成blob地址
        var blob = new Blob([content]);
        eleLink.href = URL.createObjectURL(blob);        
        // 触发点击
        document.body.appendChild(eleLink);
        eleLink.click();        
        // 然后移除
        document.body.removeChild(eleLink);
    };    function download(name,href) {
        var $a = document.createElement(&#39;a&#39;);
        $a.setAttribute("href", href);
        $a.setAttribute("download",name);        
        var evObj = document.createEvent(&#39;MouseEvents&#39;);
        evObj.initMouseEvent( &#39;click&#39;, true, true, window, 0, 0, 0, 0, 0, false, false, true, false, 0, null);
        $a.dispatchEvent(evObj);
    }   function downloadUrl(src){
        var $a = document.createElement(&#39;a&#39;);
        $a.setAttribute("href", src);
        $a.setAttribute("download", "");        
        var evObj = document.createEvent(&#39;MouseEvents&#39;);
        evObj.initMouseEvent( &#39;click&#39;, true, true, window, 0, 0, 0, 0, 0, false, false, true, false, 0, null);
        $a.dispatchEvent(evObj);
    }
    </script>
    </body>
    </html>
Copier après la connexion

Recommandations associées :

Comment supprimer des éléments spécifiés d'un tableau en js (deux méthodes)

Que diriez-vous de js Écrire une animation CSS ? Comment écrire une animation CSS en js (code)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal