Есть устаревший способ, с которым можно ознакомиться здесь, а ниже мы рассмотрим рекомендуемый подход.
Для работы с буфером обмена был внедрен Clipboard API.
Он позволяет не только двунаправленно работать с буфером обмена, но также и обрабатывать события, с ним связанные.
Так так нас интересует только копирование в буфер, то мы рассмотрим здесь две функции — write и writeText. Обе являются асинхронными и требуют таким образом определённого алгоритма применения:
|
1 2 3 4 5 6 7 8 9 |
let text = 'Your Text'; navigator.clipboard.writeText(text) .then(() => { console.log('Text copied'); }) .catch(err => { console.error('Error while copying text: ', err); }); |
Отличие функций очевидно: writeText передаёт только текстовое содержимое, в то время как write позволяет передавать HTML и даже изображения.
Если по каким то причинам вам не удобно использовать асинхронную функцию, то её вызов можно обернуть в обработчик следующего вида:
|
1 2 3 4 5 6 7 8 9 10 |
copyToClipboard(text); async function copyToClipboard(text) { try { await navigator.clipboard.writeText(text); console.log('Text copied'); } catch (err) { console.error('Error while copying text: ', err); } } |