Javascript скопировать текст. Используем clipboard.js

Частенько встаёт необходимость на Javascript скопировать текст. Как это сделать?
Обычно для этих целей использовали возможности Flash. Посколько у Flash была возможность взаимодействовать с буфером обмена на всех платформах, в отличие от Javascript.

Но это не удобно, то есть совершенно не удобно. Использовать дополнительный ролик на Flash, который долго грузится, тормозит и т.д.

Для того, чтобы на Javascript скопировать текст нужно использовать Clipboard.js

Это готовая библиотека на Javascript, которая в сжатом виде весит всего 3кб, доступна на CDN и поддерживает все платформы.

Использовать её до смешного просто.

Нужно подключить скрипт с clipboard.js
Нужно создать объект класса clipboard
Нужно назначить элемент, текст которого будет копироваться

Рассмотрим на примере:

<script src="dist/clipboard.min.js"></script>
new Clipboard('.btn');
<button class='btn' data-clipboard-target="#foo" data-clipboard-action="copy">Copy</button>
<input type='text' id='foo' value='Text to be copied'>

В качестве параметров в конструктор класса clipboard можно передавать DOM объект, массив DOM объектов или DOM селектор.

В качестве data-clipboard-action можно указывать copy или cut, это не обязательный параметр, но можно даже вырезать текст, а не просто скопировать.

Также можно обойтись без дополнительного элемента, то есть просто указать атрибут data-clipboard-text, и копировать текст по нажатию кнопки из него.

Кроме того, Clipboard.js обладает достаточно подробной и понятной документацией, так, что разобраться в большом количестве возможных опций не составит труда.

Скачать и почитать документы можно на сайте Clipboard.js.