Творческая мастерская Ваш WEB стиль. Разработка и дизайн сайтов
WEB-Дизайн | Создание сайтов | 3D графика
Всегда на связи:

Как скопировать текст в буфер обмена с помощью js (JavaScript)?

Сегодня рассмотрим задачу -  скопировать текст в буфер обмена средствами js (JavaScript).Это может быть полезно, когда создается карточка организации с реквизитами или другими данными, которые нужно иметь возможность перенести.

Техническое задание:

  1. копировать текст по клику
  2. множественное использование на одной странице

Рассмотрим код, который дает возможность скопировать текст и другой контент (приведен ниже). Обратите внимание на вкладку разметки и js скриптов.

See the Pen
Untitled
by Alex (@alex_voit)
on CodePen.

Скопировать текст в буфер обмена js скрипт  - пояснение

  • 1 и 18 строки – это обертка скрипта, которая препятствует выполнению скрипта до загрузки библиотеки.
  • 3 строка означает, что скрип сработает только при клике на объектах с классом copy-btn. Эта настройка позволит использовать скрипт на нескольких объектах одной страницы.
  • 10 строка добавляет класс родительского элемента, для вывода подсказки о том, что текст скопирован.
  • 12-14 строки нужны для того чтобы задать таймер – время которое будет отображаться подсказка.
Творческая мастерская Ваш WEB стиль. Разработка и дизайн сайтов
Закрыть форму
Спасибо. Ваше сообщение отправлено

В ближайшее время, мы свяжемся с вами для уточнения всех деталей. Письмо придет на указанную электронную почту