Если файл генерируется на фронт-енд, то как инициировать скачивание файла в js? Давайте посмотрим.
Скачивание инициируется после нажатия пользователем на ссылку в браузере. Потому мы создадим элемент ANCHOR и выполним клик по нему.
Так как контент не передаётся с сервера, то он должен быть локальным. В этом нам поможет кодирование ссылки в виде blob объекта, куда мы сохраним наши данные для скачивания.
Пример функции для скачивания текста в виде файла:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
function download(data, filename) { const file = new Blob([data], { type: 'text/plain' }); const a = document.createElement('A'); const url = URL.createObjectURL(file); a.href = url; a.download = filename; document.body.appendChild(a); a.click(); setTimeout(function() { document.body.removeChild(a); window.URL.revokeObjectURL(url); }, 0); } |
Т.к. после скачивания ссылка нам становится не нужна, то она удаляется из DOM.
Данная запись опубликована в 31.07.2023 19:55 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Апрель 11, 2018 г.
swiper js - jQuery плагин для создания адаптивной карусели картинок. Посмотрим как сверстать шаблон так, чтобы элементы управления слайдером можно было размещать за пределами контейнера слайдера.
SWIPER на GITHUB.
Это стандартный шаблон, который ...
Читать
Март 20, 2025 г.
Делюсь примером кода, для создания обертки в модели экосистемы CKEditor 5.
Здесь есть несколько нюансов.
Во-первых, нужно проверить, являются ли оборачиваемые элементы валидными по отношению к обертке, в которую мы их помещаем. У CKE элементов ...
Читать
Октябрь 18, 2015 г.
С помощью селектора jQuery мы выбрали какие то элементы. Как теперь организовать их перебор в цикле? Есть пара вариантов.
Используем функцию $.each(func)
Разработчики не могли не заложить перебор по найденным элементам в библиотеку. Параметром должна ...
Читать
Март 13, 2010 г.
Недавно я затеял некоторую деятельность по созданию он-лайновой игрушки. Это из разряда хобби, и пока вообще речь не об этом. Возможно, я что то напишу об этом позже.
В отправной точке, при создании он-лайновой игрушки, я стоял перед скромным выбором ...
Читать