Post Game

Cara Membuat Double Click Pada Tag Blockquote

Cara Membuat Double Click Pada Tag Blockquote

Membuat Seleksi Otomatis Pada Tag Blockquote - Bagi sahabat yang suka berbagi tutorial, biasanya membagikan kode-kode yang suka dicopy. Standarnya penggunaan kode itu pada tag code atau tag pre. Akan tetapi setelah saya mengunjungi blog sahabat, tidak sedikit menggunakan blockquote untuk berbagi kode.

Untuk mempermudah mengcopy code yang dibagikan, sebaiknya menggunakan seleksi otomatis. Artinya, dengan hanya mengklik atau klik ganda (double click) kode tersebut akan terseleksi semua, tinggal melakukan Ctrl+C atau klik kanan kemudian Copy.

Contoh :

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

Berikut Tutorialnya

Langkah 1 : Simpan sript diatas </body>

<script type="text/javascript">
var pres = document.getElementsByTagName(&quot;blockquote&quot;);
for (var i = 0; i &lt; pres.length; i++) {
 pres[i].addEventListener(&quot;dblclick&quot;, function () {
 var selection = getSelection();
 var range = document.createRange();
 range.selectNodeContents(this);
 selection.removeAllRanges();
 selection.addRange(range);
 }, false);
}
</script>

Sebetulnya script di atas tidak mutlak untuk tag blockquote, karena selektornya berupa blockquote maka hanya berlaku untuk tag blockquote.

Lebih Lanjut : 
Seperti saya jelaskan sebelumnya, script di atas berlaku untuk tag apapun, apabila sobat ingin menerapkan untuk tag pre, maka ganti blockquote yang ditandai, menjadi pre.

Pada script di atas, saya menggunakan klik ganda (double click) untuk menerapkan satu kali klik langsung terseleksi, sobat tinggal mengganti dblclick menjadi click.

Semoga bermanfaat... 

Go to link Download