Cara membuat textarea dengan tombol "select all"

Posted by Gani Mugni Sabtu, 17 Desember 2011 0 komentar
Belajar kali ini adalah bagaimana kita menggunakan Javascript dan Css untuk menambahkan tombol "select all" pada textarea. Sehingga pengunjung lebih mudah untuk mengcopy teks atau kode yang diberikan dalam textarea, dan pengunjung hanya tinggal mengklik tombol "select all" tersbut. Textarea ini bisa kita gunakan dalam posting seperti artikel ini ataupun kita bisa taruh pada sidebar, tergantung kebutuhan.



Lebih jelasnya lihat contoh bentuk textarea dibawah ini :










Ok... Bila anda berminat membuat textarea seperti ini, silahkan anda ikuti langkag - langkah berikut :


1. Login ke blogger dengan ID anda.

2. Klik Rancangan.









3. KLik tab Edit HTML.











4. Cari kode </head>


5. Copy dan paste kode dibawah ini tepat sebelum kode </head>



<script type="text/javascript">



function selectAll(){

document.formtombol.textarea.focus();

document.formtombol.textarea.select();

}</script>




<style type="text/css">

div.textareatombol{

width:430px;

border:4px solid;

border-color:#D8D8D8;

background-color:#A4A4A4;

padding:10px;

}</style>



6. Simpan Template

7. Langkah selanjutnya Klik elemen laman lalu tambah Gadget dan pilih HTML/JavaScript

8. Copy dan paste kode dibawah ini pada gadget tersebut :



<center><div class="textareatombol">



<form name="formtombol" >

<textarea cols="50" rows="3" name="textarea">"Disini adalah teks atau kode yang diberikan kepada pengunjung untuk di copy"</textarea>


</form>

<input type="button" name="selectit" value="Select All" onclick="selectAll ();">



</div></center>


9.  Lalu Simpan dan jadi deh......



Selamat mencoba dan Semoga bermanfaat.... Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini. Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.
TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Judul: Cara membuat textarea dengan tombol "select all"
Ditulis oleh Gani Mugni
Rating Blog 5 dari 5
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi artikel ini harap menyertakan link dofollow ke http://azharadzuan.blogspot.com/2011/12/cara-membuat-textarea-dengan-tombol-all.html. Terima kasih sudah singgah membaca artikel ini.

0 komentar:

Posting Komentar

Panduan blog dan SEO support Jual Online Baju Wanita - Original design by Bamz | Copyright of Azhara Blog.