Kategoriler
Kodlama

JavaScript ile pano kullanımı

Web sayfasındaki bir metni panoya/Clipboard almak ile ilgili.

Bu yazıda, web sitemizde panoya kopyala işlevini nasıl uygulayabileceğimizi göreceksiniz. İşlev: Kopyala butonuna/linkine tıklandığında, ilgili içeriği/metni, sistemimizde herhangi bir yere yapıştırabileceğimiz şekilde panoya kopyalamak.

Başlayalım.

HTML, JavaScript ve DOM manipülasyonu hakkında bazı temel bilgilere sahip olduğunuzu varsayıyorum. Yani temel düzeyde bir web programlama mantığına sahipsinizdir, umarım.

👨‍💻 Kod:

const contentCp = document.getElementById("icerik");
const copyBtn = document.getElementById("kopyala");

copyBtn.onclick = copyToClipboard;

function copyToClipboard() {
  navigator.clipboard
    .writeText(contentCp.innerText)
    .then(() => alert("Kopyalandı"))
    .catch((e) => alert(e.message));
}

Bu kadar basit, canlı örnek de şu şekilde:

Embedde çalışmayabilir bu yüzden uygulamaya direk gidip test edebilirsiniz: https://codepen.io/wolkanca/pen/jOBQepZ

WOLKANCA

Volkan Yılmaz

Digital Marketing & WordPress & SEO volkan@volkanyilmaz.com.tr