Скачивание изображений по клику

21 Сентября 2017
javascript

Задача: при клике на заданные элементы скачивать изображение.

Создаем кнопку, можно создать любой другой элемент с атрибутом data-download_img и помещаем в него ссылку на изображение которое нужно скачать - URL_IMG. Ссылка может быть как относительной так и абсолютной.

<button data-download_img="URL_IMG">Скачать</button>

Создаём функцию download_img которая скачивает изображение URL_IMG с именем img.jpg клиенту на устройство:

// функция скачивания изображения
    function download_img(url){ 
        var link = document.createElement('a');
        link.target = "_blank";
        link.download = "img.jpg";
        link.href = url;
        link.click();
    } 

// ловим нажатие кнопки с атрибутом download_img
    $ ("[data-download_img]").click(function(){ 
        var url=$ (this).attr('data-download_img');
        download_img(url);
    } );

Важно! Для реализации необходима библиотека jquery!

Пример: пример