Cara Membuat Text Area dengan Tombol Select All

Image by alfianCMX

Cara Membuat Text Area dengan Tombol Select All - Teks area adalah sebuah kotak persegi yang digunakan untuk memuat kode scrpit HTML. Dimana kotak tersebut digunakan untuk tempat menyimpan atau menampilkan kode" HTML dalam bentuk text.

Baca juga CARA MEMBUAT LINK AKTIF DI KOMENTAR BLOG

Dan dipembahasan kali ini saya akan memberikan tutorial Cara Membuat Text Area dengan Tombol Select All. Ini merupakan modifikasi dari text area itu sendiri dimana ditambahkan tombol Select All. tentunya agar mempermudah pengunjung untuk mendapatkan kode HTML tanpa susah" memblok kodenya kebawah.

Baca juga CARA MENGHILANGKAN LINK AKTIF PADA KOMENTAR BLOG

Dibawah ini saya akan berikan gambaran asli dari text area, dan gambaran text area dengan menggunakan tombol Select All. Sobat juga dapat memodifikasi sesuai keinginan sobat. Oke disimak baik-baik ya

Kode dasar text area

Kotak diatas merupakan dasar dari text area , untuk membuat kotak seperti itu sangatlah mudah sobat , copy paste kode dibawah ini lalu letakkan di HTML disamping Compose : <textarea cols="27" rows="1" Belajar membuat Text Area :) </textarea> Keterangan : Rubah cols , rows dan "Belajar membuat Text Area :)" sesuai yang kalian inginkan.

Kode text area dengan tombol Select All

Belajar membuat Text Area :) Ketik teks/kode html yang anda inginkan :)

Nah kalo kotak diatas merupakan modifikasi dari text area, disini sana menambahkan tombol Select All dan juga background pada kotak text area.Copy paste kode dibawah ini kemudian letakkan di HTML disamping Compose :
<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All" /><div align="center"><textarea cols="55" readonly="name="txt" rows="100" style="background: #1b1b1d; color: white; height: 60px; width: 400px;" wrap="VIRTUAL">Ketik teks/kode html yang anda inginkan :)</textarea></div></form></div>

Keterangan :

[<div align="center">]
Kode diatas merupakan kode agar kotak text area menjadi center (rata tengah) , sobat bisa merubahnya menjadi rata kiri atau juga rata kanan.

[<input onclick="javascript:this.form.txt.focus();this.form.txt.select();"]
Kode diatas merupakan kode yang memuat perintah block all. Jadi agar tidak terjadi eror , kode ini tidak usah dirubah-rubah.

[type="button" value="Select All" />]
Yang diblok merah merupakan nama dari tombolnya, dan dapat diganti sesuai keinginan anda masing-masing.

[readonly="]
Kode diatas berfungsi sebagai pengunci tulisan yang berada ditextarea agar tidak dapat dirubah. Kode ini cukup penting,terutama untuk text area yang berisi script agar pembaca tidak dapat mengubah isi didalam kotak textarea.

[style="background: #1b1b1d; color: white; height: 60px; width: 400px;"]
Kode diatas merupakan kode untuk merubah background , tinggi dan lebar kotak textarea, sobat bisa merubahnya sesuai selera. Jika tulisan yang berada didalam kotak text area banyak, maka akan muncul scroll secara otomatis. Dan jika sobat menginginkan background berwarna putih hapus saja kode background: #1b1b1d;

[Ketik teks/kode html yang anda inginkan :)]
Merupakan isi dari kotak pada text area , silakan ganti dengan kebutuhan sobat dan jika tulisan yang berada didalam kotak text area banyak, maka akan muncul scroll secara otomatis.

Baca juga MENGATASI TOMBOL BALAS/REPLY YANG TIDAK BERFUNGSI

Warna-warni banget ya postinganku kali ini ?hahahaa :P. Gimana sobat mudah sekali kan ? jika sobat ingin bereksperimen silakan klik link ini http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_textarea. Oke sobat sekian yang bisa saya share tentang Cara Membuat Text Area dengan Tombol Select All. Tunggu update-update selanjutnya yang pastinya semakin bermanfaat untuk anda. Selamat mencoba :)

Bagikan Artikel

Cara Membuat Text Area dengan Tombol Select All

4/ 5

Oleh alfian

alfian 4/27/2014 08:00:00 PM 4 Komentar

4 komentar

Tulis komentar

Anonymous

April 27, 2014 at 10:18 PM

bagus nih tutorialnya mantap banget,izin nyobain yamas

alfian

April 27, 2014 at 10:26 PM

silakan gan , makasih ya kunjungan baliknya

Beby

April 28, 2014 at 7:36 AM

Cakep ya, jadi lebih berwarnaaaa

April 28, 2014 at 12:34 PM

hahaa iya mbak , makasih kunjungannya ;)

Peraturan Berkomentar di situs alfiancmx.blogspot.co.id

1. Berkomentarlah Sesuai Topik Artikel
2. Berkomentarlah Menggunakan Bahasa Yang Jelas
3. Berkomentarlah Dengan Sopan
4. Tidak Menyisipkan Link Aktif (Live Link)
5. Tidak Berkomentar Promosi
6. Tidak Berkomentar Spam

Apabila melanggar mohon maaf komentar pasti saya hapus :)

Cara Membuat Text Area dengan Tombol Select All | AlfianCMX

April 27, 2014