Skrypt 3: Kopiowanie tekstu do schowka
ŚredniTeoria
Pozwala użytkownikowi skopiować tekst (np. kod rabatowy, link do udostępnienia, numer konta) jednym kliknięciem, bez ręcznego zaznaczania i kopiowania.
Kod (JavaScript)
<input type="text" id="kodDoSkopiowania" value="RABAT2026" readonly>
<button id="przyciskKopiuj">Kopiuj kod</button>
<p id="potwierdzenie"></p>
<script>
const pole = document.getElementById("kodDoSkopiowania");
const przycisk = document.getElementById("przyciskKopiuj");
const potwierdzenie = document.getElementById("potwierdzenie");
przycisk.addEventListener("click", function () {
navigator.clipboard.writeText(pole.value).then(function () {
potwierdzenie.textContent = "Skopiowano do schowka!";
});
});
</script>
Komentarz i wyjaśnienie kodu
navigator.clipboard.writeText() to wbudowana w przeglądarkę funkcja obsługi schowka systemowego — zwraca tzw. Promise (zaawansowany temat spoza tego kursu), dlatego kod potwierdzający sukces umieszczamy w .then(...), które wykona się PO zakończeniu kopiowania.
Typowe błędy
Funkcja navigator.clipboard wymaga połączenia HTTPS (albo localhost) — nie zadziała na stronie otwartej bezpośrednio z dysku bez serwera lub bez szyfrowanego połączenia.