Как копировать ссылки с помощью javascript примеры
Копировать ссылку в буфер обмена с помощью javascript
- Скачать скрипт clipboard
- Подключаем скрипт для копирования ссылки clipboard.
- Копирование ссылки javascript которая выведена текстом
- Копирование ссылки javascript из атрибута
Скачать скрипт clipboard
Первым шагом к копированию ссылки нам нужен скрипт:
который распространяется пока бесплатно -> ссылка разработчика.
Чтобы не случилось с выше идущей ссылкой на сайт разработчика, мы добавили этот скрипт в свой каталог скриптов -> скачать

Подключаем скрипт для копирования ссылки clipboard.
Скачали скрипт для копирования, бросаем куда-тов папку на сервере с помощью ftp
У нас код подключения вот такой:
И далее основной скрипт копирования ссылки:
<script>
var clipboard = new ClipboardJS('.toCopy');
clipboard.on('success', function(e) {
new_text = ('Text:', e.text); alert('Скопировано : ' + new_text);
e.clearSelection();
});
clipboard.on('error', function(e) {
alert('не скопировано');
});
</script>
Копирование ссылки javascript с id
Далее один из способов копирования ссылки - например у нас есть тег ссылки:
Необходимые условия для копирования ссылки из данного тега наличие id!
Далее нам понадобится кнопка, которая и будет производить копирование!
Обязательное наличие<button class="toCopy" data-clipboard-target="#my_copy">Скопировать</button>
Теперь... соединим весь код для копирования вместе, как это должно выглядеть в коде(копировать ссылку будем там, где выделено красным!):
<script src="путь до файла/2.0.0.clipboard.min.js"></script>
<script>
var clipboard = new ClipboardJS('.toCopy');
clipboard.on('success', function(e) {
new_text = ('Text:', e.text); alert('Скопировано : ' + new_text);
e.clearSelection();
});
clipboard.on('error', function(e) {
alert('не скопировано');
});
</script>
<a href="здесь ссылка..." target="_blank" id="my_copy"><button class="toCopy" data-clipboard-target="#my_copy">Скопировать</button>
Результат;
https://dwweb.ru/page/js/019_ckopirovat_ssyilku_js.htmlКопирование ссылки javascript из атрибута
Опять же будем использовать скрипт clipboard.js, теперь создадим, например кнопку - это не обязательно должна быть кнопка, можно просто див.
Нам снова понадобится класс -<button class="toCopy" data-clipboard-text="https://dwweb.ru/page/js/019_ckopirovat_ssyilku_js.html#paragraph_5">Скопировать ссылку</button>
Второй раз объявлять и запускать clipboard.js не будем, мы уже один раз это сделали!
И результат:
скопировать ссылку скопировать ссылку Js скопировать ссылку javascript копирование url copy link javascript