Bir çok sitelerde gördüğümüz panoya kopyalama özelliğinin nasıl yapıldığını sizlere öğreteceğim.
Panoya kopyalamayı daha geniş anlatırsam, sitenin belirli bir bilgiyi, yazıyı veya linki, ziyaretçinin bilgisayarının geçici belleğine atması ve kullanıcının gerektiğinde bu bilgiyi Yapıştır komutunu kullanarak elde edebilmesi.
İlk önce JQuery kodunu vereyim.
function Kopyalama(element) {
var $temp = $("<input>")
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
alert("Panoya kopyalandı")
}; |
Şimdi de, ziyaretçinin kopyalamasını sağlayacağımız bilgiyi veya linki gizli bir div oluşturup içine atalım.
<div id="kopyalanacak" style="display:none">www.emreguney.info</div> |
Şimdi de kopyalanacak adındaki gizli divimizin içindeki bilgiyi kopyalamak için yani JQuery kodumuzu çalıştırmak için bir tetikleyici link yapalım. Ziyaretçi tıkladığında kopyalanacak isimli divdeki bilgi bilgisayara kopyalansın.
<a href="#" onclick="return Kopyalama('#kopyalanacak')">Panoya Kopyala</a> |
İşlem bu kadar. JQuery ile panoya kopyalama işlemini gerçekleştirdik. Ayrıca fark ettiyseniz alert fonksiyonu ile kullanıcı linke tıkladığında bir uyarı mesajı kutusu gelecek ve Panoya kopyalandı bilgisi gösterilecektir.
Siz bu örneğimi geliştirebilir ve daha kapsamlı bir kullanım elde edebilirsiniz.
